A moduláris felépítés lebegő blokkal div világos fix - tech blog
Clearfix hack népszerű módja helyesen megjeleníteni az úszó egységet, amely lehetővé teszi, hogy nem folyamodnak a táblázatok elrendezése. Az igény felmerül, amikor elkezdi észrevenni, hogy a magassága a szülő DIV blokk nem egyezik a tartalmát az örökösök. Például, ha fogant ilyen szervezeti egységek webhelyén (az érthetőség kedvéért, a szülő egység sárgával, és a gyermek - zöld és piros):
Miért írni, mint egy HTML oldal:
és ez a megfelelő CSS fájl stílus:
De a valóságban, akkor lesz a következő kép:
A szülő DIV ne ölelje a gyermeket. Ez nem nyúlt a magassága megegyezik az alkotó egységek. És nem tévedés itt nem csak az elrendezés a lebegő blokkal (float tulajdonság). Lebegő elemek kihúzta a jelenlegi patak, és hozzon létre a szülő közötti kapcsolatot a saját. Így a külső áramlás, akkor nem lesz méretben. És a szülő DIV véve méretüket és feszített azok tartalmát szüksége van egy kis trükk.
Két módja, hogyan nyúlik a méret a szülő DIV tartalmú egységek benne foglalt
Korábban használtam ezt a plusz blokk lezárása előtt a szülő DIV:
Ezt követően, a megjelenése a oldal megfelel annak, amit szánták:
A második út, hogyan lehet a szülő div nyúlik a magassága a leányvállalat
Tudod, hogy egy „öntisztító” tartály egy ál-után:
A szülői egység hozzá a megfelelő osztály:
Megjelenése az oldal is megfelelnek a tervezett elrendezés:
Mindkét módszer jól működik. És lehetővé teszi számunkra, hogy megoldja a problémát a lebegő blokk a szülő DIV feszített magassága leányvállalata tartalmát.
Is olvasható: A ragadós sidebar WordPress nélkül dugó. CSS és Theia Sticky oldalsáv.