O problema cu care se confrunta blogeri zilelor noastre este faptul ca teamplate-urile lor nu sunt compatibile cu toate browserele,astfel apar probleme cand vizitatorii navigheaza cu Internet Explorer 6,Opera,Safari,Internet Explorer 7 etc.
Web-designerii creaza sabloane blogger(teamplates) folosind doar un browser(Firefox).Probabil ei nu isi dau seama sau nu vor sa isi dea seama ca,codul css folosit de ei nu se potriveste sau nu este compatibil cu toate browserele care activeaza in prezent.Incompatibilitatile apar mai ales la Internet Explorer 6.
Asadar,in acest post,va voi spune cum sa creati un cod CSS care sa fie compatibil cu toate browserele amintite mai sus.
Pentru inceput,aveti nevoie de 2 browsere,eu am ales Internet Explorer 6 si FireFox 3.
Pentru inceput,haidati sa vedem daca blogul tau este compatibil cu toate browserele.
Pentru asta,va rog vizitati acest site Browser Screen shots.
Introduceti URL-ul sitului vostru si vedeti pozele,care va vor arata felul in care arata situl incarcat pe diferite browsere.


Pasul 2.Daca vedeti vreo incompatibilitate,veti fi nevoiti sa va modificati codul CSS.
Haidati sa vedem un exemplu:


Codul CSS pe care il vom utiliza este:

#example {
float : left;
width : 170px;
margin-left : 5px;
}

Acum,vom presupune ca blogul nostru nu este compatibil cu Internet Explorer versiunea X.
Trebuie sa modificam codul de mai sus,astfel:

#example {
float : left;
width : 170px;
margin-left : 5px;
}
#example {
float : left;
width : 185px;
margin-left : 3px;
}

Primul cod CSS este optimizat pentru Internet Explorer,iar al doilea pentru celelalte browsere:Firefox,Opera,Dildo etc

Pentru a realiza compatibilitatea codului de mai sus(proaspat modificat) trebuie sa ii mai aducem cateva retusuri,folosind metoda child selector command.Nu va voi vorbi despre aceasta metoda ca sa nu va induc in eroare.Modificati codul de mai sus,astfel:

#example {
float : left;
width : 170px;
margin-left : 5px;
}
html > body #example {
width : 185px;
margin-left : 3px;
}

Ceea ce am colorat in verde reprezinta compatiblitatea cu IE,iar ceea ce este cu rosu reprezinta compatibilitatea cu celelalte browsere.