A little something about everything

internet marketing and website development made simple..

How to target specific browsers within certain platforms, such as mozila & safari within mac for CSS design

You would first need to target the operating system which can be best accomplished by using javascript such as:

if(navigator.userAgent.indexOf('Mac') > 0) {

//code

}

Now in order to target the browser version you can use things such as if ie triggers for internet explorer

<!--[if (gt IE 6)&(lte IE 7)]>
<link href="/css/IE.css" rel="stylesheet" type="text/css">
<![endif]-->

or webkit for mozila or safari

@media screen and (-webkit-min-device-pixel-ratio:0) {
your css here
}

final code to target internet explorer on mac would look something like this:

if(navigator.userAgent.indexOf('Mac') > 0) {

<!--[if (gt IE 6)&(lte IE 7)]>
<link href="/css/IE.css" rel="stylesheet" type="text/css">
<![endif]-->


}

 

 

 

Add comment

Loading