CSS - a to snad ne

9.4.2009 13:37 | Přečteno: 1897× | všechno možny | poslední úprava: 14.4.2009 09:00

Jak někteří z vás již poznali, mé sporadické zápisky do blogu jdou vesměs rozdělit do dvou kategorií. V první kategorii jsou zápisky věcné, technicky zaměřené, v druhé kategorii jsou pak hanopisy. Do této druhé kategorie patří i tento zápisek. Čelně jsem se totiž střetl s CSS (Cascading Style Sheets)...
Nejsem webdesignér a obecně se na tvorbě webových stránek podílím velmi nerad. I přesto jsem však nucen občas do této oblasti zabrousit a upravit své osobní stránky nebo udělat nějakou vnitrofiremní aplikaci. Zatímco programování backendu (v Perlu nebo Javě, PHP mi na oči nesmí) si vyloženě užívám, při tvorbě designu vyloženě trpím.
Jedním z mých projektů je i hojně využívaná aplikace sloužící k přenosu velkých souborů mezi uživateli (ať již v rámci naší společnosti, tak i mezi naší společností a externími subjekty). Z důvodu jednoduchosti pro uživatele je vše postaveno na webových protokolech (principiálně je to podobné webu uschovna.cz). Současnou, déle jak rok s úspěchem běžící verzi, jsem napsal kompletně (od nuly) v Perlu. A teprve teď se dostávám k původnímu plánu přepsat ji do JSP. S tím jsou spojeny ještě další úpravy a mj. i pár úprav ve vzhledu.
Hned na titulní stránce jsem chtěl využít jistého efektu, kterého nelze docílit bez použití CSS. I když se mi stále nedařilo, aby ta jediná věc vypadala tak, jak bych si představoval, začala ve mně hlodat myšlenka, že bych se na CSS mohl podívat hlouběji a přestal používat holé HTML, které při tvorbě stránek používám beze změny od roku 1996. Rozhodl jsem se, že stránku s velmi jednoduchým designem (pět obrázků, šest odkazů a minimum textu) přepíšu tak, aby kompletně a správně používala styly...

AU!

Po osmi hodinách jsem to vzdal a pokorně se vrátil k obyčejnému HTML. Za tuto dobu se mi podařilo po velkých obstrukcích dostat pod kontrolu hlavičku a patičku stránky, nikoliv však samotný obsah. Navíc, vždycky když už to začalo nějak rozumně vypadat, stačil pohled v jiném prohlížeči a bylo vymalováno. Požadovaného efektu se mi nepodařilo docílit vůbec. Mnohokrát jsem četl, že je třeba stránku ladit pro každý prohlížeč zvlášť, ale myslel jsem si, že jsou to jen hraniční případy u složitých designů. Nikoliv, nakope vás to zřejmě vždyzky...
Ano, myšlenka CSS je chvályhodná. S její implementací do podoby standardu už to tak slavné není. A za způsob implementace tohoto standardu do prohlížečů by mělo pár lidí asi viset za koule v průvanu. Smutné je, že ačkoliv implementace ve FF by měla standardu odpovídat více, tak v některých ohledech (centrování) mi implementace v IE7 přišla logičtější.
Během těch pár ztracených hodin zkoušení a googlování jsem oblažoval svými výsledky kamarády na Jabberu. Jeden z nich, programátor a pracovník jednoho ISP, mě po mém rozhodnutí o přepis do CSS nejprve ocenil větou:

on: timhle "style" zpusobem? i ty Brute?

a postupně na má zjištění reagoval:

on: no, ja kdyz neco vyjimecne delam se stylama tak google je hlavni napoveda a taky casto zasnu
on: cely to css je nejaky divny
on: takovy nejaky jako by si tam kazdy definoval co chce nejakyma vlastnima slovama. je to hrozne ukecany
...
já: ja ti zacina mit pocit, ze to CSS vymyslel nekdo moc nemocnej
on: a mel horecku a blouznil...
...
on: vitej ve skutecnem svete
...
on: v pohode. ja teda nevim jak to presne mas, ale v kazdym pripade souhlasim ze je to DIVny a chova se to v kazdym prohlizecu jinak, coz je sviňstvo.
...
ja: odmitam uverit, ze na tomto je postaven soucasny web
on: ver a ulevi se ti
on: teda ver, smir se, a ulevi se ti
on: ja se smiril. a css nepouzivam. a jeho existence mi tudiz tolik nevadi



A ještě jedna perla z diskuze, kterou jsem vygoogloval (s názorem se ztotožňuji):

Simple, straightforward, useful:
<center>
...
...
</center>

An unnecessary addition, but still simple and useful:
<div align="center">
...
...
</div>

An idiodic "improvement" (now with 500% more code!):
<style>
center{margin-right:auto;margin-left:auto;width:740px;}
</style>
<div class="center">
...
...
</div>

This is progress?!?!?


ODMÍTÁM UVĚŘIT, ŽE NA CSS PASKVILU JE POSTAVEN CELÝ SOUČASNÝ WEB! Chci zpátky dobu, kdy byl můj jediný místní poskytovatel připojen 64kbit linkou do Brna a odtud 128kbit do Karlsruhe a kdy web byl ještě normální!

Doplnění po proběhlé diskusi

Protože někteří diskutující nepochopili o co mi šlo, přidám ještě pár slov na vysvětlenou:
Ano, vím, k čemu slouží CSS. Proto jsem ho také chtěl použít. Abych změnou jednoho CSS souboru mohl kdykoliv změnit vzhled aplikace a nasadit ji třeba jinde (momentálně je "natvrdo" ve "firemních barvách").
Ano, mluví ze mě neznalost CSS. Každá technologie, kterou jsem zatím nepoužil, je pro mě do jisté míry neznámá. Když mě zajímá, nebo ji potřebuji, teprve pak do ní začnu pronikat. A CSS jsem tak dlouho ignoroval jen proto, že tvorba webů je pro mne nezajímavá a nezajímavou i zůstane.
A co mi teda vadí?
Vadí mi to, jak je CSS navrženo, implementováno, jak se chová. Použiji příměr k programovacím jazykům (i když nevím, zda je zrovna nejšťastnější). Zatím každý jazyk, který jsem se v minulých dvaadvaceti letech učil (od BASICu přes Assemblery až po Javu), se choval konzistentně a podle dokumentace. U CSS se musí chování odhadnout a ladit. Úplně stejně jako teď na CSS bych se tedy tvářil třeba na C, pokud bych například musel počítat s tím, že na některé architektuře sice compiler přeloží program používající násobení, ale to tiše nebude fungovat. Vždyť přece musím vědět, že na této architektuře násobení nefunguje a musí se přepsat jako postupné sčítání...        

Komentáře

[Luk]

v některých ohledech (centrování) mi implementace v IE7 přišla logičtější

Tak bacha, IE 8 se zase o něco více blíží specifikaci (a ostatním prohlížečům, jako je Firefox a Opera).

[Zdenek]

Chci zpátky dobu, kdy byl můj jediný místní poskytovatel připojen 64kbit linkou do Brna a odtud 128kbit do Karlsruhe a kdy web byl ještě normální!

aaa pan je zrejme masochista, tak to doporucuji shapper a cproxy. A upravit DNS server, tak aby odpovidal na kazdy 350 dotaz, at to mate trosku vice realnejsi

[Jan Kurik]

Díky za tento zápisek. Já už měl delší dobu pocit, že jsem široko daleko jedinej, kdo nepochopil přínos CSS.

[Luk]

A ještě jedna věc:

An idiodic "improvement" (now with 500% more code!):

Tohle svědčí o naprostém nepochopení toho, k čemu CSS slouží. Idea je taková, pomocí HTML definovat právě a jen logickou strukturu dokumentu (sémantiku), kdežto vzhled realizovat pomocí CSS. Čili když je pak potřeba vzhled změnit, změní se jen CSS (nebo se jeden CSS nahradí jiným - viz třeba vzhled abíčka), do HTML není potřeba sahat. Protože čuňačiny typu:

<div class="center">

skutečně nic nevylepší. Kdežto když je tam něco jako:

<div class="exclamation">

tak lze snadno změnit, jak to "exclamation" bude vypadat - například takhle:

div.exclamation {
  text-align: center;
  font-weight: bold;
}

Když se pak někomu obsah této třídy bude zdát málo výrazný, dá se drobnou změnou CSS (na jediném místě) změnit vzhled této třídy na celém webu.

[Zdenek]

Tak, tak. Navic si tu upravu muze uzivatel jednoduse udelat az na svem prohlizeci.

[Jiří Svoboda]

Já naprosto přesně chápu, k čemu by mělo být CSS dobré, ale to by napřed muselo fungovat. A všude stejně fungovat.

[Luk]

Všude stejně nefunguje ani to HTML, takže to není důvod, proč odmítat CSS.

[Ladicek]

No jo, ono se řekne oddělení obsahu od prezentace. Jenže CSS ve svojí úloze komfortně definovat vzhled žalostně selhává. Na barvičky ještě dobrý, ale už to centrování přes marginy je postavený na hlavu. O implementaci v prohlížečích nemluvě: tuhle jsem měl hezkou myšlenku, centrovaný blok umístím do nějakého jiného, kterému nastavím display: inline-block (navenek blokový element, uvnitř řádkový) a text-align: center. No jo, to by ale někdo ten inline-block musel podporovat

[razor]

podle http://www.quirksmode.org/css/display.html to s podporou inline-block není tak hrozné. Až na starší IE.

[Ladicek]

To bylo v době, kdy Firefox byl 1.5 nebo 2, na něm jsem pohořel. Hezké na tom bylo, že Internet Explorer to zobrazil dobře I když k tomu dospěl prazvláštním způsobem (čti: chybou).

[Ladicek]

A když na to ještě koukám, uvědomuju si, že jsem to popsal blbě. Inline-block se navenek tváří jako řádkový, ale uvnitř jako blokový, takže text-align: center bylo pro obalující blok a display: inline-block pro vnitřní, centrovaný.

[happy barney]

CSS je vlastne len nálepka na HTML/XML dokument.
Pre demonštráciu zámeru CSS odporúčam pozrieť:
www.csszengarden.com (jeden dokument, rôzne štýly - to len aby jeden neplakal za <center>)
popr jedna pekná stránka od človeka, ktorý CSS rozumie: css/edge
pre príklad ale netreba ísť príliš ďaleko, aj abclinuxu má svetlý/tmavý design

[Martin Baleja]

csszengarden bylo to prvni co me napadlo - to je totiz jako ukazka vyuziti kaskadovych stylu uzasne

[Johny z Podoli]

posledních pár týdnů pracuji čistě ze zájmu na webu kam si lidé mohou nahrát své fotky, a rád bych lidem dal možnost si web kompletně nastylovat. Už dělší dobu ladím "html" aby pomocí css šlo kvalitně měnit vzhled. Na csszengarden.com je html které si už dělší dobu "přeji" mít... :) nevíte jak to je s licencí? Je zde problém "doslova" obšlehnout kostru jeho dokumentu a použít to pro vlastní hračky? Nemohu se tam nikde dočíst jak si htmnl licencuje :D prosím help me, kdo víte víc...

[Josef Kufner]

Co bys chtěl obšlehávat? Vždyť tam je jen pár divů...

[Johny z Podoli]

Ano, obšlehnout těch pár divů.. to je přesně to co chci :D

[Josef Kufner]

Je lepší se zaměřit na myšlenku jimi reprezentovanou, než na reprezentaci samotnou.

[Kvakor]

Hmm, a tohle je terpve začátek, opravdová sranda nastává až v okamzžiku, když člověk zjistí, že se stejné HTML+CSS zobrazuje v různých prohlížečích různě (většinou toto prozření provází zvěšené množství kleteb na adresu programátorů Internet Exploreru), to je teprve ten pravý nářez

I když jsou lidé, kteří tvrdí, že tato nauka, krásně nazvaná na jednom webu jako "prohlížečosloví" (browserlore), s nástupem používání rozličných frameworků a IE 7+ postupně zanikne, já se naopak obávám, že dokud budou ve WinXP stále strašit IE 6.0, bude jí stále třeba. Alternativní metodu - donutit grafiky, aby nedělaly návrhy, které jdou uchodit v IE 6- jen s pomocí magie typu behavior a DirectX filtry - považuju po získaných zkušenostech za nepůchodnou.

[Mmurphy]

Než začnete plácat takového a jim podobné nesmysly o CSS, raději Vám doporučím následující knihu: CSS Kaskádové styly pro webdesignéry - Autor: Marek Prokop. Až si ji přečtete, tak můžete znovu napsat do blogu článek o CSS - podložený fakty. Ono totiž CSS není špatné, jenom vy o něm nic nevíte natož abyste pochopil jeho smysl.

[Max]

Přesně tak.
Když něco neznám, tak to neurážím
Zdar Max

[happy barney]

ale "demokracia" predsa takto nefunguje čo neznám/neznášam, to prekričím

[Jirka]

Tak se mi zdá, že kvůli 5 odkazům, 3 obrázkům, nadpisu a patičce, děláte z komára velblouda.

Je pravda, že by CSS mohlo být komfortnější a podporovat nějaký "mocnější" způsob definice rozložení stránky. CSS3 přináší pěkné novinky (třeba dělení odstavce do sloupců jako v novinách). Ale kvůli jistým potížistům můžeme být rádi, že se alespoň konečně naučili správně počítat rozměry prvku s rámečkem.

[CEST]

Nejsem web designer a moje HTML tvorba se taky obvykle bez CSS obejde, ale pritomnost CSS chapu.

Pokud generujes v Perlu (nebo i treba PHP) 1000 radku v tabulce, teda neco jako <tr><td>bleble</td></tr>, tak samozreme do TD muzes nacpat i vlastnosti a ty pak jednoduse menit.

Pokud bys tech radku ale mel v HTML dokumentu staticky a potreboval bys u vsech policek nastavit jinou barvu pozadi, tak budes muset bud "carovat" napr. s vimem a udelat si makro nebo regexp, nebo (lepe) pouzit styl a nadefinovat barvu pro TD. Pak se ti hned nastavit u vsech policek.

A pokud budes dobre planoval, tak muzes udelat velkej HTML dokument s pouzitim class a vlastnosti (barvy, velikosti, zarovnani atd) budes menit jenom na jednom miste v CSS. Dalsi vyhoda je, ze muzes stranky generovat v Perlu/PHP a budes chtit mit pro ruzne struktury vzdy stejne vlastnosti, ale s moznosti jednoduse je menit. Tak budes generovat stranky se stylama a podle predvolby muzes nahravat ruzny CSS soubory, ktery budou definovat vzhled.

Takze CSS chapu, pouzivam, jen kdyz je to nutne, ale taky me toci, ze browsery to bud spatne nebo uplne jinak implementujou. Chovat se SMTP servery jako se chovaji Webbrowsery, tak nam posta nedojde, nebo dojde uplne rozjebana (oni SMTP servery taky nejsou 100% kompatibilni, ze ano pani z M$, ale vestina nastesti je).

[Jirka]

Nejde jen o snadnost změny vzhledu, ale i o velikost zdrojáku. Zdálo by se, že to je dneska jedno, ale s nástupem mobilních telefonů na kterých se snadno prohlíží web (a dementních datových limitů našich operátorů) je velikost stránky opět kritická.

U t-mobile mám 50 MiB FUP za měsíc a běžným prohlédnutím několika stránek během jízdy MHD po městě stáhnete hned několik MiB. Na celý měsíc to ani náhodou nevystačí a pokud je u každého druhého elementu uvedeno style="border- .... font ... text ... color ... margin ... padding ... , tak se to posčítá.

[Luk]

U t-mobile mám 50 MiB FUP za měsíc a běžným prohlédnutím několika stránek během jízdy MHD po městě stáhnete hned několik MiB. Na celý měsíc to ani náhodou nevystačí a pokud je u každého druhého elementu uvedeno style="border- .... font ... text ... color ... margin ... padding ... , tak se to posčítá.

Opera Mini? Já vím, jde to přes proxy (se vším, co k tomu patří), ale na občasné kouknutí se někam...

[Jirka]

Sice Apple pustil na App Store nějaké alternativní webové prohlížeče, ale Opera Mini tam bohužel není (alespoň pokud vím, už dlouho jsem se nedíval). Jinak mobilní Safari je velmi dobrý prohlížeč a s výbornou ergonomií. Ale stahuje plnou webovou stránku se vším všudy (vyjma flashe). Kdyby uměl jít přes proxy, s podobnou funkčností jako mají ty od Opery, tak bych to uvítal.

Osobně si myslím, že by operátorům neublížilo, kdyby mobilnímu připojení trochu povolily kohoutky. Ale nejspíš se bojí, že by místo 10 mld CZK vydělali jenom 9,9 mld CZK.

[Luk]

No jo, iPhone...

[Jirka]

Jobsova politika je někdy hodně zvláštní, ale dokud někdo nenabídne ergonomičtější zařízení, tak jsem ochotný to trpět.

[misch]

Dík za hodnotný příspěvek. Hlavně že jsme se dozvěděli kterou stránku se ti nepodařilo do CSS převést, případně jak se ty tvoje pokusy o CSS chovaly v různých prohlížečích, že? :-(

Mimochodem, dřív stačilo napsat <blink>aaa</blink> nebo <marquee>yyy</marquee>. Teď abych takové věci dělal animovanými GIFy (500 % nárůst!) nebo ve Flashi (1350 % nárůst velikosti, 26735 % nárůst spotřeby paměti!).

This is progress?!?!?!?????

[pavlix]

 

Dík za hodnotný příspěvek. Hlavně že jsme se dozvěděli kterou stránku se ti nepodařilo do CSS převést, případně jak se ty tvoje pokusy o CSS chovaly v různých prohlížečích, že? :-(

Mimochodem, dřív stačilo napsat <blink>aaa</blink> nebo <marquee>yyy</marquee>. Teď abych takové věci dělal animovanými GIFy (500 % nárůst!) nebo ve Flashi (1350 % nárůst velikosti, 26735 % nárůst spotřeby paměti!).

This is progress?!?!?!?????

 

Erm... že bys to fakt neuměl líp? :). Btw... žádný progress to není, jen vyčištění HTML od věcí, který tam nikdy neměly být a vlastně ani nebyly :).

[happy barney]

v zmysle, že sa vyhodili tie otravné pohybujúce sa somariny, áno, je to progres. Btw, ako sa vám darí vytlačiť ich?

stránka, ktorá obsahovala blink alebo marque, išla do blocklistu. gify zakázaná animácia, na flash flashblock. Btw, efekt sa dá dosiahnuť aj javascriptom ba dokonca prekvapujúco aj java apletom. A keby chcel byť autor úplne otravný, tak si napíše vlastný plugin a bude ho vyžadovať.

[Jan Drábek]

S takovýmhle přístupem se o to radši ani nepokoušejte a nechte to mladším :D

[Ritchie]

Váš příspěvek nehovoří toliko o CSS, ale o vaší (ne)schopnosti pracovat s webovými technologiemi.

Apropos i v PHP (verze 5.2) lze programovat čistě a objektově, používat vlastní ORM a generovat pomocí XSLT výstupní XHTML ostylované CSS. Skutečnost, že to neumíte, není přeci důvodem, proč šmahem výše zmíněné zavrhovat.

[Daniel Kvasnička ml.]

Apropos i v PHP (verze 5.2) lze programovat čistě a objektově, používat vlastní ORM a generovat pomocí XSLT výstupní XHTML ostylované CSS. Skutečnost, že to neumíte, není přeci důvodem, proč šmahem výše zmíněné zavrhovat.

Ne, ze bych mel neco proti ORM ci XSLT, ale ukladat data relacne, pak je mapovat na objekty a kvuli view je serializovat do XML a transformovat...? Bud ORM a slusny sablonovaci system, nebo neco jako SQL2XML ci rovnou nativni XML db a pak XSLT jako view

[Ladicek]

Já mám proti obojímu to samé: je to jako drbání levou nohou za pravým uchem při zubařském zákroku, možná ještě horší.

[Filip Jirsák]

Navíc tam úplně chybí AJAX. Já bych z toho XML generoval JSON, který by se poslal na klienta a tam by to JavaScript zobrazil. Přičemž ten JavaScript by samozřejmě nemohl být nějaký ručně napsaný skript, ale něco generovaného, třeba by se nějaký Pythonovský kód pomocí Ruby mohl přeložit do toho JavaScriptu. Pak by to teprve bylo dostatečně in. To ORM by samozřejmě bylo na aplikačním serveru a web server by si odsud ta XML tahal přes WebServices, to snad ani nemusím dodávat.

[Ritchie]

Upřímně, mně je skutečně jedno, jestli je něco in či out, ale pro mě je důležité, aby se projekt dal snadno udržovat. Protože přístupnost považuji za zásadní, tak AJAX nepřipadá v úvahu. Nicméně děkuji za ironii, bohužel nepadla na úrodnou půdu.

[Filip Jirsák]

To ale máte asi docela jednoduché XSLT šablony, ne? Protože „udržovatelnost“ a „XSLT“ mi nějak moc nejde dohromady.

[Ritchie]

Ehm, nad slovem „jednoduchost“ se dá diskutovat dlouze, neb to není bez dalšího měřitelný pojem. (Mám své zkušenosti v jednání s humanitně zaměřenými lidmi, proto nemíním se složitostí šablon polemizovat, aniž by byla zavedena vhodná kvantifikace složitosti.) Lakonicky řečeno, šablony odpovídají velikosti projektu. Nicméně XSL mně opravdu přijde jako docela snadno udržovatelné.

[happy barney]

XSLT je obyčajný funkcionálny jazyk, akým je napr Lisp. Ǎno, má svoje otravné muchy. Udržovateľnosť je inak v pohode. Napr. môže pomôcť rozbiť šablónu na viacero menších blokov. Osobne si myslím, že XSLT je udržovateľnejšie, ako povedzme taká Java.

[Filip Jirsák]

Osobně jsem pro to používat deklarativní přístup všude tam, kde je to možné, protože se pak dají dělat např. různé automatické kontroly. Ale jakmile se struktura vstupního a výstupního XML od sebe výrazněji liší, nebo jakmile je do transformace potřeba zapojit ještě nějakou další logiku, je podle mne XSLT nepřehledné. A rozdělení do menších bloků by nepomohlo – problém není v délce zdrojáku, ale v tom, že třeba je nutné spoustu věcí odněkud od kořene stromu probublat přes spoustu šablon až na místo určení. Pak stačí, že je potřeba do koncové šablony přidat další parametr, jehož hodnotu zjistíte někde u kořenu, a musíte jej přidat do deseti dalších šablon, co jsou mezi. XSLT 2.0 už umožňuje parametry tunelovat, což je trochu zlepšení, ale podobných případů existuje víc.

[happy barney]

jj, tie parametre, to je jedna z tých otravných múch. Bežný postup v tomto prípade je dvojstupňová transformácia: v prvom kroku pridať do stromu vypočítané parametre, v druhom kroku ich používať.

[Ritchie]

Jako nejlepší šablonovací systém dopadlo z několika důvodů právě XSL. Přímé mapování SQL do XML není možné, protože aplikační logika není přímočará, takže mezi databází a XML je několik netriviálních kroků. Po analýze aktuálního stavu technologií se domnívám, že jsem zvolil skutečně vhodný způsob.

BTW Pokud chcete na serveru používat formuláře ve stylu XForms, tak se stejně XSLT do (X)HTML formulářů nevyhnete.

[Daniel Kvasnička ml.]

No nevim, XSLT pouzivam nemalo, ale pokud pouzivam ORM, tak fakt nevim, v cem by XSLT melo byt lepsi nez treba PHPTAL... Neznalost neomlouva

BTW Pokud chcete na serveru používat formuláře ve stylu XForms, tak se stejně XSLT do (X)HTML formulářů nevyhnete.

Pokud budu chtit pouzit XForms, tak pouziju Chibu nebo nejaky jiny server side XForms engine a jestli ten bude pouzivat XSLT nebo ne, to je mi celkem fuk. A nebo pouziju JS client side XForms engine.

[R]

Ja teda nepotrebujem objekty na to, aby som z textov v databaze vygeneroval text v (X)HTML - vyuzivam PHP ako skriptovaci jazyk. Sice to podla niekoho nie je take "ciste", ale kod je jednoduchsi a rychlejsi a navyse sa mi lepsie pise aj cita.

Urcite by boli niektori ludia z toho mojho kodu zhrozeni, rovnako ako som ja zhrozeny, ked sa umelo vymyslaju objekty tam, kde ziadne nie su.

[Filip Jirsák]

Řekl bych, že jste spíš jen nepochopil, jak CSS funguje. Ono začínat někde uprostřed podle nějakých náhodných vygooglených střípků asi nebude úplně ideální. Kdybyste se pokoušel řídit auto tak, že byste do něj sednul a otevřel Google, asi by to taky nedopadlo dobře... CSS má svoje nástrahy a záludnosti a třeba v CSS úplně chybí modul pro layout, ale vycentrovat text s CSS jde snadno.

[Nicky726]

Tak z mých nevelkých zkušeností s CSS si nemůžu zas až tak stěžovat na CSS jako na IE... Ale taky to bude tím, že jsem nepoznamenán HTML s tabulkovými layouty a ceter tagy, resp. jsem tohle už dávno skoro zapomněl.

[kozzi]

Mimochodem mám pocit že:

<style>
center{margin-right:auto;margin-left:auto;width:740px;}
</style>
<div class="center">
...
...
</div>

By ti stejně v Internet Exploreru nejelo

[Kvakor]

Ano, muselo by se to obalit nejakým blokovým tagem (většinou zas divem), který má text-aling: center. Sice by podle specifikace blokové objekty neměli na text-align reagovat, ale svým způsobem je štěstí, že funguje alespoň tohle ...

[Luk]

By ti stejně v Internet Exploreru nejelo

Ale jelo. V osmičce stoprocentně (ovšem podle toho, jaký doctype by se použil), v sedmičce možná také (teď si nejsem jistý). V šestce tedy samozřejmě ne

[kozzi]

Tuším že v sedmičce to nejelo. A v osmičce záleží jaký režim zobrazení je zapnutý . touto funkcí mě IE8 dostalo

[____]

Ve striktním módu to samozřejmě jede.

[moira]

Nedavno jsem nasel tento clanek...

http://www.flownet.com/ron/css-rant.html

[kozzi]

Zrovna nedávno jsem měl právě problém kterej je tam popsanej.

[Josef Kufner]

Příloha:

• sloupecky.html (904 bytů)

CSS mají podporu pro tabulkový layout i bez tabulek. Podívej se na přiložený kód. Velmi elegantně lze využít vlastnosti tabulek a přitom mít vše stylované...

Má to drobný háček... teda spíš pořádnou skobu   IE to neumí.

[init_daemon]

Skusam to v IE 8 a funguje. :)

[kozzi]

no ale to je jaksi k nicemu ze?

[kozzi]

To je prave ten problem. Kdyby to IE umelo tak jsem v poho. Takto musim vymyslet silenosti, aby se web zobrazoval jak v IE tak ve FF tak v opere dobre.

[David Jaša]

Jaký je praktický rozdíl mezi: <div style="display: table a <table?

[Luk]

První se zobrazí jako tabulka, ale sémanticky to není tabulka. Druhý je sémanticky tabulka, i když se může zobrazovat jakkoli jinak.

[Josef Kufner]

Třeba to, že máš všude divy a nemusíš řešit při generování html jeho umístění v layoutu. Například můžeš vygenerovat stejný blok uprostřed textu a pak v nějaké patičce/hlavičce a přitom mít stejný html kód (a tím i výrazně jednodušší generátor) a pak v CSS definovat, že ten v textu bude mít jen obyč rámeček a ten v hlavičce/patičce bude jako buňka tabulky (definice nebude na ID, ale na kombinaci třídy nadřazeného elementu a třídy elementu).

[=^..^= AmigaPower®]

Vítej v realitě

<!--[if IE]>
<![endif]--> 

<!--[if !IE]> -->
<!-- <![endif]-->

[Miloslav Ponkrác]

CSS není dobře udělaný standard.

Ale ono je to také tím, že CSS poprvé imlementoval Microsoft (dříve, než vůbec W3C tušila, že CSS existuje, a že se jím bude zabývat). Když pak W3C převzala CSS za své a začala ho brát jako svůj standard, velmi mnoho věcí ve W3C bylo vedeno nikoli snahou o dobrý standard, ale: „hlavně, aby to bylo jinak, než to implementoval MS, ať má MS problém“. To byla často větší priorita, než funkčnost, a tak schválně W3C změnila řadu věcí, mimo jiné i box model proti tomu, co existovalo před tím, než W3C dostala CSS do ruky. A na „promyšlenosti“ CSS je to znát.

Já s tím také často zápasím, a poté co jsem do hloubky pronikl do CSS nějak už v realitě nemám tendenci být fanatikem do CSS jako jsem býval. Přestal jsem být fanatikem a bijcem proti tabulkovému layoutu, ač ho nepoužívám. V realitě totiž je CSS zprasené, a tudíž reálně je nutné prasit. A web založený na CSS je opravdu poněkud, no prostě webdesigneři se naučili řadu prasečin, nazývají to „hacky“, aby nemuseli o sobě tvrdit, že prasí – ono by to dost nehezky znělo v kontextu s různými jejich prohlášeními o “čistotě kódu“ a „validním kódu“.

[Fluttershy, yay!]

Nebylo to náhodou tak, že MS jako obvykle implementoval první návrh standardu? A nebyl náhodou MS členem W3C?

Hacky nejsou proto, že by webdesignéři chtěli prasit, nýbrž proto, že každý prohlížeč implementuje CSS jinak (zvláště u MS se moc nechtějí držet standardů, ač by mohli, kdyby chtěli).

[Ladicek]

A nebylo to náhodou tak, že v IE i NN byl box model implementovaný sice stejně, ale v rozporu s CSS? A ve W3C holt nebyli schopní překousnout svou hrdost a tlačili dál svou verzi, kterou v té době nikdo neimplementoval a která je mimochodem (myslím, že nejen) dle mého názoru nelogická.

[happy barney]

Oba prístupy majú svoje výhody a nevýhody. Niekedy vyhovuje jeden, inokedy druhý.

[moira]

+1

[happy barney]

ako by ste inak nazval / ošetril situáciu, keď zo štvorice "top, left, bottom, right" IE 4 nepodporuje right a IE 5 nepodporuje bottom? Alebo chýbajúca podpora z-index na jednom tagu? (problémy IE5). Alebo niečo novšie, viacero class v jednom tagu? Aj toto boli definície "ať má MS problém" ?

Mne osobne napr v CSS viac vadí neprítomnosť dedenia (class aaa rozširuje class bbb, napr. tento tag má menu-color pozadie). Nejaký ten boxmodel hore-dole, hoci definovať oba, jeden prehlásiť za default s možnosťou lokálnej zmeny, alebo aspoň pridanie inner/outer-width/height by ich veľa nestálo.

[YYY]

CSS se mi zda naopak velice prinosne. Moznost behem chvilku a elegantne nadefinovat vhledy ruznych trid a znacek. Na druhou stranu mi na soucasne vyvoji vadi vsudypritomny flash - hlavne kvuli pametove narocnosti

[CandySan]

To je hodne hustej zapisek!

Faktem je, ze rozkrikujes jen svoji nevedomost.

Me se napr. docela dost libi, kdyz naisu aplikaci a vubec me nezajima jak bude vypadat. Nebo kdyz napisu aplikaci ci web a budu chtit jednoho dne zmenit cely layout i vzhled. Pokud bych psal webovy vystup bez stylu, musel bych natvrdo zasit vzhled do kodu a to je u me kontraproduktivni. Nejsem totiz grafik a nemam esteticke citeni abych ja osobne presne trefil finalni design uz na pocatku, kdy teprve mydlim kod. Stejne tak nechci cekat na grafika nez vyplodi neco, co jeste ani nemohl videt v provozu atd...

Libi se mi, kdyz odevzdam web, a pak nekdo udela grafiku, nebo kdyz napisu modul a bez uprav ho muzu pouzivat na ruznych webech s ruznou grafikou.

A ze css nefunguje..? no... ani to neni slozite. Jsou overene techniky a ty funguji vsude a jsou i nektere specificke techniky, ktere se nepouzivaji protoze jsou zavisle na ruznych implementacich. Pokud clovek trochu css umi, tak se takovym konstrukcim vyhne a vse dela na prvni zapojeni.

Aby to bylo co nejsnazsi, tak je dobre vyvarovat se chyb, tedy:

- dodrzovat normu (coz je zaklad pro minimalizaci prekvapeni v ruznych browserech) a pouzivat co nejvyssi normu - nejlepe striktni xhtml

- kontrolovat validitu kodu (zacatecnici musi, pokrocilejsi pisi validne na prvni stouch)

- pouzivat vhodne nastroje - predevsim chrobaka a taky se hodi webdeveloper

- v krajnim pripade pouzivat specialni css file jen pro ie6 - tam to nekdy zakulha, ale ostatni se da udrzet v pohode (tedy ie7,ie8,ff,opera,safari) u celeho weu s tisiciradkovym css byva pro ie6 jen 2 az 3 styly (nejakych kratouckych radku)

- kdyz uz jsi tak nestastny z toho css a nevis poradne k cemu slouzi (viz style=""), tak zkus omrknout a osahat kaskady a uvidis jaky netuseny obzor se ti otevre (jednak to souvisi s tim mym troufalym, ale pravdivym zacatkem a druhak je celkem zajimave, ze ony ty styly jsou predevsim kaskadove a ze to tak nejak neco lehce naznacuje ;) )

 

Ackoliv tedy nejsem grafik, tak css je z meho pohledu naprosto nepostradatelne a plne funkcni reseni, na kterem nastesti uz leta muze web stat. Mozna ze ty benefiy jsou takove prave pro negrafiky. Grafik naopak (si tak nejak predstavuju jeho praci) muze mit tendenci vse mydlit do kodu - aspon bych to povazoval za omluvitelne, protoze prave on a nikoli programator se zajima jen o vysledny vzhled. Takze prave jemu to css nemusi byt uziecne v pocatku jeho prace, ale hned pri prvnich upravach a zmenach oceni, ze nemusi kontaktovat vyvojare, pokud ten mu pripravil aplikaci poctive a spravne.

Stejne tak je mozne mit jeden system a ten muze mit tisice vzhledu a tisice modulu a tisice programatoru techto modulu nemusi vubec uvazovat o moznych tisicich vzhledu ve kterych jejich moduly mohou beze zmeny behat. To uz je celkem slusny duvod proc na to ten web stavet, ne? Ovsem chce to obcas kouknout se na to i ze sirsi perspektivy a ne jen z uzkeho vyhledu vlastnich "veleuzasnych kopirovatek VELKYCH souboru"