Witajcie,

Posiadam problem w html/css. Graficznie przedstawia się tak:





Czerwone pola i zielone są <fieldset> . Chciałbym aby pod ie 6 pola wyświetlały tak jak w firefox. Aby każdy box zaczynał się równo względem siebie tak jak jest to na screenie  FF.

Struktura html tego przypadku przedstawia się tak:

[HTML] pobierz, plaintext 
 
<div>
 
 <fieldset>
 
test1
 
</fieldset>
 
 <fieldset>
 
test2
 
</fieldset>
 
 <fieldset>
 
test3
 
</fieldset>
 
 <fieldset>
 
test4
 
</fieldset>
 
 <fieldset>
 
test5
 
</fieldset>
 
 <fieldset>
 
test6
 
</fieldset>
 
</div>
 
[HTML] pobierz, plaintext 

Natomiast css :

[HTML] pobierz, plaintext 
 
fieldset {border:1px solid #844F01;float:left;margin-bottom:20px;width:45%;}
 
[HTML] pobierz, plaintext 

W takim przypadku pod FF jest ok. Div nad fieldset'ami nie posiada żadnych stylów. Niestety nie mogę zmieniać struktury html. Macie jakieś propozycje ?

margin i padding wyzerowane?

Do każdy tych 2 pudełek 3 osobne divy z clear: both; overflow: hidden; i float left lub right

Ewentualnie css

ale nie gwarantuję, że to pomoże

Dobra, napiszę w jaki sposób poradziłem sobie z tym problemem. Udało się z pomocą jquery.

[HTML] pobierz, plaintext 
  $(".fieldset1, .fieldset2 ").wrapAll('<div></div>');
[HTML] pobierz, plaintext 

Pierwszy fieldset oraz drugi tą metodą zostaje wsadzony w diva. Kuma to IE 6 i inne.

Dzięki temu zabiegowi skutecznie zostają od siebie oddzielone 2 pierwsze fieldsety. Dla kolejnych trzeba powtórzyć zabieg. Chyba że można to jeszcze jakoś uprościć. Znacie panowie jakiś ciekawy sposób ?