Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to do a Chrome/Opera specific stylesheet?

Tags:

I need to do chrome/opera hacks because of a font replacement script wanted by the client that breaks things... this is sad but everything is working in IE6-7, FF2-3 and Safari. I have no way of fixing the script itself, I can only hack around it using CSS and HTML.

I'm trying to do something in the lines of :

<!--[if IE 6]>    <link rel="stylesheet" href="ie6.css" type="text/css" media="screen" /> <![endif]--> 

Is it possible?

I saw this way of doing chrome specific fixes like:

body:nth-of-type(1) .elementOrClassName { /* properties go here */ } 

Is this working? Is there a simpler way? What about Opera?

Thanks!

like image 480
marcgg Avatar asked Jun 03 '09 15:06

marcgg


People also ask

How do I apply a specific CSS rule to Chrome?

Use of the new @supports at-rule or 'feature check' allows your browser to check if a specific CSS property or feature, and its value, is supported in the user's browser.


1 Answers

A clean javascript way to do this: http://rafael.adm.br/css_browser_selector/

It ads browser specific classes to the body tag of your html which you can use in your css like:

.opera #thingie, .chrome #thingie {   do: this; } 

Hope this helps.

like image 194
Thomas Maas Avatar answered Oct 03 '22 11:10

Thomas Maas