How to add seprate css for IE Browsers in Drupal Theme

It is very normal scenario  that your main css file is not affecting in IE browsers. For that, you will have to create separate css files and add those files in page.tpl.php inside your drupal theme.

Note:- Paste following code inside head tag in page.tpl.php file.
Code for adding css file in page.tpl.php :-

For IE6:-
<!--[if IE 6]>
     <link type="text/css" rel="stylesheet" media="all" href="<?php print $base_url;?>/sites/all/themes/splendapro/css/ie6_splenda.css" />
   <![endif]-->

For IE7:-
<!--[if IE 7]>
     <link type="text/css" rel="stylesheet" media="all" href="<?php print $base_url;?>/sites/all/themes/splendapro/css/ie7_splenda.css" />
   <![endif]-->

For IE8:-
<!--[if IE 8]>
     <link type="text/css" rel="stylesheet" media="all" href="<?php print $base_url;?>/sites/all/themes/splendapro/css/ie8_splenda.css" />
   <![endif]-->

Note:-The code above looks like commented but it is not.So use as it is.
 
For Safari browser:-
<?php    
   if (strpos($_SERVER['HTTP_USER_AGENT'], 'Safari') !== FALSE) {
          ?>
      <link type="text/css" rel="stylesheet" media="all" href="<?php print $base_url;?>/sites/all/themes/splendapro/css/safari.css" />
    <?php
    }
?>


Note:- Yo just need to change the css file path in above codes,and use the rest code as it is.

No comments:

Post a Comment