IE stylesheets
If you are a web designer or have ever tried to design a web site, you will no doubt come across the fact that one of a web designers biggest issues will be getting a web site consistent across all the major browsers. Many times I will visit a web site that works perfect in Internet Explorer, however when viewing it in another browser such as Firefox it does not work, or some parts are missing or there is some other issue. It happens the other way around too, with it working perfect in Safari on a Mac, but then on PC with with IE (Internet Explorer) there are problems. Thankfully, cross-browser websites come standard with all my web design packages
So I thought I would share a little tip that can help iron out problems in IE. If you find that your site is working great in most browsers except IE, you can use a CSS IF statement what will apply different styles if the user is using IE to view the web page. For example:
In your webpage where you define your stylesheet, you can write this:
<link rel="stylesheet" type="text/css" href="my-normal-style.css" />
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="my-ie-style.css" />
<![endif]-->
What that does is it first defines your normal style sheet, but then if the user is using IE to view your page, it will use the IE specific stylesheet instead. You can even go far as to specify what version of IE they may be using. For example:
<!--[if IE 5.0]>
<link rel="stylesheet" type="text/css" href="ie-version-5.css" />
<![endif]-->
<!--[if IE 5.5]> <link rel="stylesheet" type="text/css" href="ie-version-5.5.css" /> <![endif]-->
<!--[if IE 6.0]> <link rel="stylesheet" type="text/css" href="ie-version-6.css" /> <![endif]-->
In most cases you are able to program your styles to work in all browsers, however sometimes (after pulling all your hair out) you can easily use this technique to fix your problems.