Pracuję na stronie internetowej (link text), ale mam problem z właściwością wysokości w Google Chrome. Jeśli przeglądasz stronę, zauważysz, że nie ma koloru tła. Dzieje się tak dlatego, że #mainContent ma wysokość 0 pikseli. W programie Internet Explorer tak nie jest. Czy ktoś ma pomysły?Dlaczego wysokość mojego tagu div jest obliczana jako 0 w Chrome?
Dzieje się tak, ponieważ wewnętrzna zawartość jest pływająca. Elementy rodzica nie pobierają wysokości unoszonych dzieci. Spróbuj dodać overflow: hidden; do #mainContent css.
Spróbuj jednoznacznie określić domyślną
wysokość: auto;
Wszystko wewnątrz #mainContent jest pływające. Pływaki nie zmieniają rozmiaru kontenera. Najprostszym rozwiązaniem jest dodanie wyraźnego prawa przedtem końcem #mainContent tak:
<div id="mainContent">
<!-- inner bars -->
<div style="clear:both;"></div>
</div>
Mam wrażenie to będzie coś zrobić z zawartością #mainContent nie div wypychanie pojemnika prawidłowo. Powinieneś być w stanie naprawić to na wiele różnych sposobów, na przykład używając div rozróżniania.
Dodaj następujący CSS:
.clearfix{
clear:both;
}
i dodać div z klasą clearfix przed zamknięciem div Maincontent:
<div id="mainContent">
<div id="rightSide">
...
</div>
<div id="content">
...
</div>
<div class="clearfix"/>
</div>
Należy przypomnieć przeglądarkę zmusić otworzyć div Maincontent aby dopasować to zawiera.
Haha, to będzie trudne pytanie, na które należy odpowiedzieć, ponieważ istnieje wiele sposobów, aby wyczyścić pływaki. (Możesz także wypróbować zmienną #mainContent)
Oto cudowna quirksmode article.
To jest "hacky" rozwiązanie (jestem pewien, że jest więcej "semantycznych" sposobów), ale jest to najłatwiejszy i jeden z najczęściej używanych. +1 –
Absolutnie w porządku. Nigdy nie lubiłem tego robić z powodu bałaganu, ale jest on martwy - łatwy i dobrze obsługiwany. – anq
Ten również zadziałał, ale dodanie przepełnienia: ukryte dla CSS oznaczało, że nie musiałem modyfikować każdej strony osobno. Co podobało mi się trochę lepiej. – Quentamia