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.

comments powered by Disqus