Załóżmy, że mam sobie taką oto strukturę elementów na stronie WWW:

Wygląda, że wszystko jest w porządku, jednak gdy uruchomimy taką stronę efekt wynikowy będzie zupełnie nie taki, jakiego byśmy się mogli spodziewać. Wynik w Firebugu:

Co jest? Nasz zewnętrzny element div (outer2) został wciągnięty do środka pierwszego zewnętrznego elementu div (outer1).
Co powoduje takie dziwnie zachowanie? Po kilku chwilach zdziwienia, zwątpienia i rozczarowania udało się ustalić, że za złe zachowanie odpowiedzialny jest ten element:

Tak zamknięty element powodował to zachowanie. Wystarczy zmienić go na

&lt/div> a wszystko wróci do normy. Można powiedzieć, że mały to problem, ale często męczący. Ja np. praktycznie z automatu dodaję “niepoprawnie” zamknięty tag jak tworzę layout i potrzebuję mieć element, który będzie miał ustawiony clear:both.

Zawszę piszę po prostu:

i oczywiście wpadam w tę pułapkę. Mam nadzieję, że może komuś to pomoże i nie straci za dużo czasu na zastanawianiu się gdzie jest błąd. A może to tylko u mnie występuje ten efekt? Ktoś potwierdzi powtarzalność?

Paweł Łukasik

Founder of Octal Solutions a .NET software house.
Passionate dev, blogger, occasionally speaker, one of the leaders of Wroc.NET user group. Microsoft MVP. Podcaster – Ostrapila.pl