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".
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.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With