Chcę, aby mój element div kontenera uzyskał maksymalną wysokość swojego elementu podrzędnego. nie wiedząc, jaki wzrost div
będzie miało dziecko . Próbowałem na JSFiddle . Pojemnik div
jest na czerwono. który się nie pojawia. Czemu?
css
css-float
liquid-layout
Neel Basu
źródło
źródło
Unosisz dzieci, co oznacza, że „unoszą się” przed pojemnikiem. Aby uzyskać prawidłową wysokość, należy „wyczyścić” pływak
Styl div = "clear: both" czyści zmienną i podaje prawidłową wysokość kontenera. zobacz http://css.maxdesign.com.au/floatutorial/clear.htm aby uzyskać więcej informacji o pływakach.
na przykład.
źródło
Czy to nie jest takie łatwiejsze?
źródło
Spróbuj wstawić ten usuwający element div przed ostatnim
</div>
<div style="clear: both; line-height: 0;"> </div>
źródło
Najlepszym i najbardziej kuloodpornym rozwiązaniem jest dodanie
::before
i::after
pseudoelementy do kontenera. Więc jeśli masz na przykład listę taką jak:A każdy element na liście ma
float:left
właściwość, to powinieneś dodać do swojego css:Lub możesz spróbować
display:inline-block;
właściwości, wtedy nie musisz dodawać żadnych poprawek.źródło