Cei care s-au documentat deja despre acest aspect, stiu si cred ca designul bazat pe CSS este calea de urmat, acel “the way to go” in web design.
Acestea fiind spuse, layout-ul bazat pe CSS nu este perfect, si are nevoie de ceva lucru in anumite domenii, care ma tem ca nu vor fi abordate de browserele majore, cel putin pentru un timp. Invata sa faci siteuri cu Howdodesign.com!
CSS – cea mai mare problema – Pagina de baza CSS.
Problema majora cu aspectul bazat pe CSS este ca, uneori, este nevoie de hack-uri pentru a face lucrurile sa functioneze incrucisat.
Care este problema cu hack-urile?
Majoritatea acestor hack-uri depind de IE (Internet Explorer) care nu poate citi anumite coduri CSS standard, pe care le pot citi celelalte browsere. Strategia de baza este de a ascunde codul care ar determina IE sa sparga paginile din interiorul acestor fragmente de cod CSS mentionate anterior.
Deci, in codul CSS pe care IE il poate citi, setati lucrurile pentru restrictiona IE de la barfing, in timp ce in celalalt cod CSS (lucrurile pe care IE nu le poate citi), ati pus regulile code / CSS, care vor face toate celelalte browsere sa functioneze corect.
Problema cu aceasta abordare.
Ce se intampla atunci cand IE decide sa joace dupa unele dintre regulile in care alte browsere incep sa “vada” in aceste hack-uri, dar unde IE are inca problemele fundamentale ale hack-urilor in care incearca sa rezolve abordarea? Bineinteles, baietii de la Redmond (Microsoft) ar putea rezolva problemele care faceau hack-urile necesare … dar istoria ar sugera ca nu ar trebui sa contati pe asta!
Un exemplu clasic de Css Hack:
Imi place sa folosesc “child div” pentru a face lucrurile sa functioneze atat in FF / Mozilla si IE. Primul lucru pe care il faceti este sa introduceti regulile CSS, astfel incat sa functioneze in IE si apoi sa utilizati hack-ul pentru al suprascrie pentru Mozilla.
Un exemplu de hack “child div”:
#leftMenu> #topVerticalMenu {margin-left: 30px;} / * child of div hack * /
Aceasta regula spune: aplicati acest stil (marginea-stanga: 30px;) la orice element care se afla in #topVerticalMenu ID daca ID-ul #topVerticalMenu in sine este in ID #leftMenu.
Acest lucru este putin confuz, dar nu va faceti griji despre asta – tot ce trebuie sa stiti este ca IE nu poate intelege aceasta regula CSS, asa ca IE o ignora. Dar, din moment ce FireFox si Mozilla o inteleg, CSS se aplica in acele browsere, care functioneaza corect in acest sens.
Cu alte cuvinte, regula CSS: “margin-left: 30px” – va avea efect numai in FireFox si Mozilla, nu in IE, deoarece IE nu o intelege.
Un ultim punct despre acest CSS hack – regulile CSS sunt aplicate (de catre browser) de sus in jos, astfel incat regulile CSS care apar pe ultima pagina vor fi aplicate pe ultima, suprimand regulile mentionate anterior. De aceea, “child div” trebuie sa fie aplicat dupa CSS IE.