WordPress.org

1. inorganik
   Member
   Posted 3 years ago #

   Due to the styles in my webpage, I had to employ a special stylesheet for IE because it wouldn't render properly- specifically the alternating comments, and the submit and search buttons.

   So I used the <!--[if IE]> hack. But IE is still picking up my regular stylesheet for those items. I made some glaring color changes on the IE stylesheet, to see if it was working, and it was. Which is why I'm confused about why the other elements (submit and search buttons, alternating comments) aren't getting picked up.

   Does anyone have any idea why? The specific styles I'm trying to replace have the same names. With the buttons, I'm just trying to change the background image. The comments would take a little longer to explain.

   Thanks for your help!

2. esmi
   Theme Diva & Forum Moderator
   Posted 3 years ago #

   If the alternate sheet is being picked up, then it would seem that the either the problem lies in the classes you've declared in that sheet or the sheet is being over-ridden by your default style. Did you ensure that the <!--[if IE]> ... <![endif]--> conditional comment (it's not a hack) was after the call to your default stylesheet?

3. inorganik
   Member
   Posted 3 years ago #

   Yes... here's the complete ie stylesheet link:

   <!--[if IE]>
   <link rel="stylesheet" type="text/css" href="/_wordpress.../style_for_ie6.css" />
   <![endif]-->

   I don't know why styles of the same name on my regular stylesheet would over ride the ie versions. That's what I'm trying to figure out....

4. esmi
   Theme Diva & Forum Moderator
   Posted 3 years ago #

   I don't know why styles of the same name on my regular stylesheet would over ride the ie versions.

   Because styles cascade. Later formatting will always take precedence of an earlier formatting block. For example, if the order of stylesheets is:

   <link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" media="screen" />
   <!--[if IE]>
   <link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/ie.css" media="screen" type="text/css" />
   <script src="<?php bloginfo('template_directory'); ?>/focus.js"
   <![endif]-->

   the css in style.css will be overwritten by ie.css. However, reverse the order:

   <!--[if IE]>
   <link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/ie.css" media="screen" type="text/css" />
   <script src="<?php bloginfo('template_directory'); ?>/focus.js"
   <![endif]-->
   <link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" media="screen" />

   and style.css now over-writes ie.css.

   So the order of the stylesheets in header.php is critical.

Topic Closed

This topic has been closed to new replies.