Znikło coś, czyli paskudny błąd IE7

Sytuacja jest prosta. W pewnym miejscu serwisu przestała się pokazywać zawartość jednego z boksów. Widać było sam kontener, prawidłowo wypełniony tłem i prawidłowo rozciągnięty w pionie przez swoją zawartość.

Jedno ale. Zawartości nie widać.

Przykładowy listing:

  • <div class=”a”>
  • <div id=”dyn”></div>
  • </div>
  • <div class=”a”>
  • <div class=”b”>treść</div>
  • </div>

Wszystkie divy są float’owane do lewej, wszystkie też mają ustawiony clear po lewej stronie. Całość znajduje się w jakimś divie o ustalonej szerokości, a div.a mają taką samą szerokość jak parent oraz padding:0;margin:0.

Kluczem całego błędu okazało się być to, że div#dyn ma dynamicznie generowaną zawartość. (kalendarzyk).

Co było błędem?

Zmieniająca się wysokość pierwszego div.a powodowała przesunięcie drugiego div.a, jednocześnie div.b pozostał na swoim miejscu. Jego top … się nie zmienił, mimo position:static. Po prostu pozostaje, tam gdzie stał, wyłażąc w lewo poza lewy margines rodzica.

Jak naprawić?

Drugi div.a musi być ustawiony na float:none – wtedy problem nie występuje.

Published by Marcin Pietrzak

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis nec ante nec lectus laoreet feugiat. Donec aliquet justo in tellus gravida, id elementum magna convallis. Curabitur faucibus mauris sed risus egestas lobortis. Nunc vestibulum elit ac ipsum ultricies, non ultrices lorem ultrices. Nam at dolor id elit lobortis ullamcorper. Fusce commodo turpis nisi, efficitur efficitur libero dictum eget. Morbi viverra dignissim lacus. Vestibulum mi justo, dictum ut iaculis eget, scelerisque et nibh.

Więcej w błąd, css, internet explorer
Jak stworzyć stronę do wydruku

Po stworzeniu fantastycznie wyglądającej strony warto zastanowić się jak nasza strona będzie wyglądała na wydruku. To ważne, bo ile razy...

Zamknij