Vlákno názorů k článku
Současnost a budoucnost layoutů: CSS tabulky

nevím, co je na tomto řešení tak úžasného, http://pastebin.com/f668e382b funguje v podstatě stejně, pouze je kratší. (omlouvám se za pastebin, nepodařilo se mi vložit zdroják do příspěvku, pořád to hlásilo spam).

Také s různou délkou sloupců jsem nikdy neměl výrazné problémy. K čemu potřebujeme, aby byly sloupce stejně dlouhé? Pokud je celý web jednolitou barvou, tak k ničemu. A když se jedná o grafické rozlišení dvou sloupců, prostě stačí dát nadřazenému divu na pozadí ten správný obrázek. To samozřejmě už není jen čisté css, nicméně pokud je design webu tak jako tak grafický, je to jedno. Samozřejmě, toto bude fungovat jen na fixní nebo aspoň napůl fixní layout, tomu se holt musí stránka přizpůsobit.

CSS layouty jsou plně dostačující už teď, tak jak jsou. Fixní nebo flexibilní layouty jsou úplně jednoduchoučké, pouze jejich kombinace se řeší trochu kostrbatě.

CSS má mezery někde jinde (nebo je mám já ve vzdělání). Netušíte někdo, jak vytvořit horizontální css menu tak, aby se chovalo přesně jako v tabulce? Tzn. jednotlivé položky se automaticky roztáhly na celou šířku menu a šířky jednotlivých položek aby odpovídaly délce textu uvnitř.

Uzasne je na tom to, ze to s HTML tabulkami ma len podobne chovanie :)

Layouty, ktore maju hodnotu obtekania maju taku vlasnost, ze obsah, ktory sa v nom nachadza a je vacsi ako samotny nadradeny element tak jednoducho pretecie prec.

A co sa tyka automatickeho roztiahnutia na celu dovolenu dlzku:

ul {
display: table;
width: 100%;
}
ul li {
display: table-cell;
}

Ze by to tie tabulky boli taka strasna sprostost ? Ts ts ts

To řešení ohledně horizontálního menu jsem myslel funkční ve všech nejrozšířenějších prohlížečích, tzn. včetně IE6 a IE7, které tuto vlastnost bohužel nepodporují (viz článek) ;)

Samozřejmě že tabulky zas takové zlo nejsou, pokud jsou udělané dobře, nicméně pořád mám rád sémantický web a tabulky prostě na layout nejsou určeny. Kromě toho pokud chci mít hlavní obsah ve zdrojáku zcela nahoře, řešit se to musí také pomocí prapodivných hacků, takže žádná krása. Osobně jsem s možností tvorby layoutů v css poměrně spokojený.

Také si myslím, že pokud se v rámci sloupce objeví objekt širší, než samotný sloupec, je někde chyba ;) Dočasně se to dá ošetřit pomocí overflow.

Ale ty si nepochopil princip CSS tabuliek. CSS sluzi na definovanie vizualnej casti webovej stranky, cize nie su to iste ako HTML tabulky, ktore definuju obsahovu a vyznamovu cast dokumentu. Inak nechapem ako ti moznost CSS tabulky narusa semantickost webu, vysvetlis mi prosim ? Uz vyssie som spominal, ze pre uzitie obtekaneho alebo tabulkoveho dizajnu sa v HTML nezmeni ani bodka.

Co sa tyka pretecenia vnoreneho objektu za objekt nadradeny tak je to uplne bezne. Velke tabulky, nezalomitelne slova (ktore by zalomenim stratili vyznam), komplikovanejsie grafy, atd... A je to uplne bezne pri CMS.


Co sa tyka riesenia problemu. Co ti brani nad tym porozmyslat ?

pre IE definujes toto

ul li {
display: inline-block;
}

$("ul li").width( ($("ul").width() / $("ul li").length )

A to som ti dal uplne riesenie. A ani nebolo treba o tom zbytocne rozpravat.

Tady totiž došlo k drobnému nedorozumění z mé strany, za což se omlouvám :) V "Ze by to tie tabulky boli taka strasna sprostost ? Ts ts ts" jsem se mylně domníval, že mluvíš o HTML tabulkách a podle toho jsem reagoval. Samozřejmě proti CSS tabulkám nic nemám a těším se, až budou plně podporované.

K tomu přetečení: nevybavuji si, že by nějaké kvalitnější stránky měnily rozložení webové stránky kvůli širšímu obrázku v jednom ze sloupců. Na ošetření příliš velkých obrázků a grafů tady máme ten overflow a stejně si myslím, že administrátor webu či přímo CMS by si měl šířku těchto objektů ohlídat. A co se týče nezalomitelných slov, takových, co by se nevešly do průměrného postranního pruhu, je opravdu málo. A i tak se to dá ošetřit opět pomocí overflow.

O display:inline-block jsem dosud neslyšel, děkuji za tip:)

Sila FAP je v tom, ze poradi sloupcu na obrazovce muze byt uplne jine nez poradi divu v html kodu. css napisete jednou, ale html kod muzete libovolne preskladat.