Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Webkit CSS-hack deprecated?

Tags:

css

webkit

I'm using the @media screen (-webkit-min-device-pixel-ratio:0) hack to specifically address Webkit browsers.

But it doesn't seem to work, does anybody know if this hack is deprecated?

Is there other ways to target Webkit browsers?

Update: Not deprecated, I forgot to put an "and" after "screen".

like image 949
timkl Avatar asked Nov 16 '11 15:11

timkl


1 Answers

The following example will show a colored background on #box in Chrome and Safari, but not Firefox and Opera.

<!DOCTYPE html>
<html>
<head>
    <style type="text/css">
        @media screen and (-webkit-min-device-pixel-ratio:0) {
            #box { background: #f0f; }
        }
    </style>
</head>
<body>
    <div id="box">
        I'll have a background in Webkit browsers.
    </div>
</body>
</html>

If that isn't sufficient, you can have a look at this article about browser-specific CSS hacks on Webmonkey. It includes work-arounds for both Internet Explorer, Firefox, Safari, and Opera, and the example above.

like image 138
kba Avatar answered Sep 28 '22 02:09

kba