frycu.com

Czy znasz ten trick w CSS?

by on Nov.28, 2008, under Cross Browsing, CSS

Jakiś czas temu odkryłem ten malutki trick i uważam że jest bardzo ciekawy (jak i użyteczny), dlatego z chęcią dzielę się nim z wami. Gdy mam do czynienia z crossbrowsing-iem, zazwyczaj używam wyrażenia IF w HTML-u które odwołuje się do odpowiedniego CSS-a, w zależności pod jaką przeglądarką wyświetlana jest strona. I tak znalazłem trick który umożliwia trzymać wszystkie atrybuty w klasach oraz id, wszystko jest łatwo znaleźć i edytować wedle potrzeb.

Trick polega na tym, że możecie użyć hasz-a (#) i podkreślenia dolnego ( _ ), aby wykomentować atrybuty dla IE7, IE6  czy FireFoxa.

FireFox widzi “#” i “_” jako komentarze, Internet Explorer 6 za komentarz uznaje “#”, natomiast Internet Explorer 7 komentuje jak przed atrybutem znajdzie się “_”. Więc jeśli napiszesz swój kod CSS tak jak to jest na przykładzie, “zadowolisz” wszystkie trzy przeglądarki. Jest to świetna metoda, aby pogodzić padding i margin, odkąd FireFox i Internet Explorer definiują je po swojemu. 

Przykład:

#div {

      padding: 0px 0 10px 20px;  /* Wszystkie przeglądarki to widzą */

      #padding: 0px;                  /* FireFox nie zobaczy tego, ale IE7 & IE6 tak */

      #margin: 10px 0 0 20px;      /* FireFox nie zobaczy tego, ale IE7 & IE6 tak */

      _margin: 10px 0 0 30px;      /* FireFox & IE7 nie zobaczą tego, ale IE6 tak */

}

Nie testowałem tego jeszcze pod Operą i Safari (wkrótce to zrobię), ale pod FF i IE działa bardzo dobrze. Enjoy! :).

:, ,
No comments for this entry yet...

Wyślij odpowiedź

Szukasz czegoś?

Użyj wyszukiwarki ponieżej:

Dalej nie znalazłeś tego czego szukałeś/łaś? Zostaw komentarz, a napewno się tym zajmę!

Archiwum

Wszystkie wpisy są ułożone chronologicznie...