venkatadapa's sandbox: Conditional Styles

Conditional Styles for Chrome,Safari,Firefox.

We are all facing some problems while adding conditional styles for chrome, safari, firefox and IE. Of course for IE we can add easily using detault option provided by drupal theme itself using conditional stylesheet section, But for other browsers there is no such option directly. We have to write more code for this. So this module will simplify this process. Just enable this module and Add

conditional-stylesheets[chrome] = css/chrome.css
conditional-stylesheets[safari] = css/safari.css
conditional-stylesheets[firefox] = css/firefox.css

And add chrome.css, safari.css, firefox.css files in your css folder, If your css files are in different location, change the paths accordingly.

Ex: conditional-stylesheets[chrome] = stylesheets/chrome.css

Some times your styles wont work from conditional style sheets, especially for chrome, In this case just try with parent element.

Ex: If your html structure is as below

<div id="main">
      <div class="sub1">Lorem ipsum</div>
      <div class="sub2">Lorem ipsum</div>
   </div>

Suppose you want to apply different style for sub1,sub2 divs in chrome browser,

Add styles like below
#main .sub1 {
color:#cccl;
}

Instead of just

.sub1{
color:#cccl;
}