Plaveme ve floatech

Zrušení tabulkového designu přineslo mnoho bezesných nocí všem začínajícím kodérům a webovým vývojářům, co se většinu času hrabou v backendu, ale občas jsou nuceni nakódovat i nějaké to UI. A opravdovou noční můrou bude především "floutování" nebo-li různé čáry a kouzla s pozicováním, obtékáním a celkově s layoutem stránky.

Napozicovat nejaký DIV přes float: left; obvykle není problém. Ta težší část je obvykle v "clearování floatování", např. přes clear: left; nebo jiné pokročilejší řešení. Často se setkávám s použítím následujícího (nebo podobného) řešení

Třídu clearfix obvykle nastavíme obalovému prvku, takže obalový prvek bude mít stejnou výšku jako prvek vnitřní floatovaný a to je to co obvykle potřebujeme.

Článek na CSSNewbie se touto problematikou zaobírá a nakonec uvádí velmi pěkné a jednoduché řešení, bez použití nějakého clearfixu. Stačí i obalový prvek, který obaluje floatovaný prvek, "zafloatovat" a již i výška obalu odpovídá výšce vnitřního floatovaného prvku.

Samozřejmě, že pro mnoho z vás zkušených kodéŕů je to jistě samozřejmost. Ale věřím, že se najde někdo komu se to bude hodit.