Witam, byłem bardzo zdziwiony jak otworzyłem przeglądarkę FF i zobaczyłem to czego nawet w IE nie widziałem. Otóż jedna tabelka uciekła mi na prawą stronę i nie mam pojęcia dlaczego

Link: Odwiedź moją stronę

Dla nie posiadaczy FF dodaje fotkę



O dziwo są tam trzy tabelki o id wycinek, ale tylko jedna ucieka w prawo.

Kod tabelek:

[HTML] pobierz, plaintext 
<table id="wycinek" width="100%">
<tr><td width="40%">Ilość produkcji: <b></b></td><td rowspan="2" style="border-left: 1px dashed" align="center">Średnia waga produkcji: <b></b></td></tr>
<tr><td>Waga produkcji: <b></b></td></tr>
</table>
<table id="wycinek" width="100%">
<tr><td width="40%">Braki: <b> KG</b></td><td align="center">Procent brakowości: <b></b></td></tr>
</table>
<table id="wycinek" width="100%">
<tr><td width="40%" rowspan="2" >Ilość pracowników<font color="red">*</font>: <b></b></td><td align="center">KG / Roboczogodziny: <b></td></tr>
<tr><td align="center">Sztuki / Roboczogodziny:<b></td></tr>
</table>
[HTML] pobierz, plaintext 

Proszę o pomoc bo już mnie głowa boli

Nie wyczyściłeś float przed tabelką i dlatego się zawija.

Faktycznie, dorzuciłem do pierwszej tabelki float: left to wywaliło tą niżej.
Jednak nie rozumiem tego że wszystkie divy mam pozamykane, więc jakim cudem tabelka dziedziczy styl od powyższego diva, który faktycznie taki float ma ustawiony.
A i w jaki sposób mogę wyczyścić float, bo pierwszy raz się z tym spotyka ;/ ?

Poszukałem w necie i znalazłem rozwiązanie clear. Dodałem diva przed tabelkami i jest ok, ale i tak uważam że jest to łopatologiczne rozwiązanie.

[HTML] pobierz, plaintext 
<div style="clear:both;"></div>
<table id="wycinek" width="100%">
<tr><td width="40%">Ilość produkcji: <b></b></td><td rowspan="2" style="border-left: 1px dashed" align="center">Średnia waga produkcji: <b></b></td></tr>
<tr><td>Waga produkcji: <b></b></td></tr>
</table>
<table id="wycinek" width="100%">
<tr><td width="40%">Braki: <b> KG</b></td><td align="center">Procent brakowości: <b></b></td></tr>
</table>
<table id="wycinek" width="100%">
<tr><td width="40%" rowspan="2" >Ilość pracowników<font color="red">*</font>: <b></b></td><td align="center">KG / Roboczogodziny: <b></td></tr>
<tr><td align="center">Sztuki / Roboczogodziny:<b></td></tr>
</table>
[HTML] pobierz, plaintext