Většina webových designérů a koderů si jistě pamatuje na dobu ne tak moc vzdálenou, kdy se pro tvorbu vícesloupcových layoutů stránek používaly tabulky (prvek <table>), ve kterých byly vnořeny tabulky, ve kterých byly vnořeny další tabulky a tak dál. Fungovalo to perfektně. Pak přišly kaskádové styly, které tvorbu vícesloupcových layoutů značně usnadnili – v HTML kódu stačilo vytvořit pár prvků <div>, které se následně prostřednictvím CSS vlastností jako width, height, float, position atd. naformátovaly a napozicovaly podle záměru webdesignéra. Vývoj ale samozřejmě pokračoval, tvůrci HTML a CSS specifikace si konečně uvědomili, že specifikace tu má být především pro webdesignéry a ne naopak, takže v HTML5 a CSS3 přibyla spousta nových praktických značek a vlastností. Například pro vytváření sloupců pomocí CSS3 byly představeno několik speciálních vlastností jako column-count, column-width, column-fill atd. Článek CSS Columns z blogu Davida Walshe se věnuje právě těmto novým vlastnostem pro vytváření vícesloupcového layoutu. Popisuje význam jednotlivých vlastností a v příkladech demonstruje, jak je použít v praxi.

Zdroj: davidwalsh.name.

2 Příspěvků v diskuzi

  1. CSS column vlastnosti rozhodně nejsou učeny pro tvorbu layoutu stránky, ale jen k formátování textu. Nelze totiž určit, co se vykreslí ve kterém sloupci (co se nevejde do prvního se dá do druhého.

Odpovědět