Stylesheets layout issues with Internet Explorer
Stylesheets are a wonder but can be nerve breaking at times (most of the time). Different browsers and versions make web designing a nasty business.
The ultimate solution is to have different stylesheets for different browsers and versions. Have IE-readable conditional comment link to the appropriate stylesheet.
Example:
<!–[if IE]>
<link rel=”stylesheet” type=”text/css” href=”style.css”>
<![endif]–>
To deliver code to different versions of Internet Explorer, you can use the browser version and either gte, gt, lte or lt or none of these :
<link rel=”stylesheet” type=”text/css” href=”style.css”>
<![endif]–>
<!–[if IE 5.0]>
<link rel=”stylesheet” type=”text/css” href=”style.css”>
<![endif]–>
<!–[if IE 5.5]>
<link rel=”stylesheet” type=”text/css” href=”style.css”>
<![endif]–>
<!–[if IE 6]>
<link rel=”stylesheet” type=”text/css” href=”style.css”><![endif]–>
To deliver code to version of Internet Explorer 5 for Windows and higher :
<link rel=”stylesheet” type=”text/css” href=”style.css”><![endif]–>
To deliver code to version of Internet Explorer 5.5 for Windows and lower :
<link rel=”stylesheet” type=”text/css” href=”style.css”><![endif]–>
To deliver code to version of Internet Explorer for Windows below Internet Explorer 6, use this code:
<link rel=”stylesheet” type=”text/css” href=”style.css”><![endif]–>
Just replace the paragraph element with a style element, and put that in the head of page.tpl.php :
For example, to link in a stylesheet that will only be applied in Internet Explorer 6 :
<link rel=”stylesheet” type=”text/css” href=”style.css”>
<![endif]–>At the end type the default stylesheet which will be used by mozilla ++
<link rel=”stylesheet” type=”text/css” href=”style.css”>