Cross-Browser CSS

Component ID

1485414

Component name

Cross-Browser CSS

Component type

module

Maintenance status

Development status

Component security advisory coverage

not-covered

Component created

Component changed

Component body

Cross-Browser CSS is a simple module that adds the user's OS, browser and browser's version into your body tag as classes. For example, on a Google Chrome Apple user, the result will be:

<body class="apple chrome chrome17">

So you can easily do your CSS like this:

body.apple.chrome17 #block-block-2 {
  background-color: red;
}

And on a Internet Explorer 6 Windows user, the result will be:

<body class="windows ie ie6">

So you can easily do your CSS like this:

body.windows.ie6 #block-block-2 {
  background-color: blue;
}

You will then have a different display for different OS and browsers.