Maatwerk websites: webapplicaties, webshops, content management systems en oplossen website problemen.




CSS Browser Selector

Categorie : Blog apr 9th, 2011

Het blijft één van de grootste problemen van en webdeveloper: Internet Explorer 6. Telkens weer lijkt alles prima te werken, totdat de grote test in IE6 komt. En helaas zijn er nog steeds veel mensen en instellingen met deze zwaar verouderde browser.

Met de volgende truc krijgt de html-tag classes mee die aangeven welk platform en welke browser de gebruiker heeft. Hiermee kunnen van custom styles per browser worden gedefinieerd.

Op deze manier kan heel eenvoudig een uitzondering in de css gemaakt worden voor bijvoorbeeld IE6. Dit doe je door de volgende code in de <head> sectie te zetten:

<script src="http://github.com/rafaelp/css_browser_selector/raw/master/css_browser_selector.js" type="text/javascript"></script>

Vervolgens kan je een element bijvoorbeeld op deze manier met CSS stylen:

.ie6 .example {
background-color: yellow
}

Bovendien kunnen elementen ook platformspecifiek worden gestyled (win/mac/linux/iphone etc) én wordt er een class js aangemaakt als de browser van de gebruiker JavaScript ondersteund.

Deze truc bleek erg handig te zijn bij een van mijn projecten: Desind

Bron: http://rafael.adm.br/css_browser_selector/

DEEL :

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *