Forum PHP.pl

Witajcie,

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

(IMG:http://www.fotoszok.pl/upload/15095e6e.jpg)

(IMG:http://www.fotoszok.pl/upload/8d7fe9b7.jpg)

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 ?

Ten post edytował gecior 5.03.2010, 11:39:22

margin i padding wyzerowane?

Do każdy tych 2 pudełek 3 osobne divy z clear: both; overflow: hidden; i float left lub right (IMG:style_emoticons/default/smile.gif)

Ewentualnie css

ale nie gwarantuję, że to pomoże (IMG:style_emoticons/default/smile.gif)

Ten post edytował koreja 5.03.2010, 15:27:13

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 ? (IMG:style_emoticons/default/guitar.gif)