My website www.voobly.net works in Chrome and Firefox, im trying to make it work for Internet Explorer. The issue is in my CSS horizontal header links style sheet.

Q: Whats wrong with the Chrome version when I upload the IE version?
A: A square should follow your mouse over while hovering over the links, example on Chrome now.

Q: Whats wrong with the IE version when I upload the Chrome version?
A: Entire Style sheet screws up page!

Right now I have the chrome and FF one working.

If I have this code in my stylesheet.css file:


Code:
#header ul#nav li {
    float: right;
    margin: 0 5px 0 0;
}
It will work fine in Chrome and Firefox.

If the code is this:

Code:
#header ul#nav li {
    display: inline;
    margin: 0 5px 0 0;
}
It will work in IE, but not in Chrome/FF.

So I have two style sheets, once that makes FF/CHRM work, another that makes IE work, so I decided to try this:

Code:
<!-- For all other browsers -->

<link REL="stylesheet" href="stylesheet.css" type="text/css">

<![if IE 7]>

&lt;link rel="stylesheet" type="text/css" href="ie_stylesheet.css" /&gt;

<![endif]>

<![if IE 6]>

&lt;link rel="stylesheet" type="text/css" href="ie_stylesheet.css" /&gt;

<![endif]>

<![if IE]>

&lt;link rel="stylesheet" type="text/css" href="ie_stylesheet.css" /&gt;

<![endif]>

<![if IE 8]>

&lt;link rel="stylesheet" type="text/css" href="ie_stylesheet.css" /&gt;

<![endif]>

Now, ive tried endless combinations of the if IE code, none of them work, through I do have the ie_stylesheet.css in the right place, so why isnt it working? Do you have a solution? Ive uploaded my files for you, please take a look and get back to me, Im in dire need of help! Thankyou.

My CURRENT style sheet: (Chrome/FF)
http://www.voobly.net/download.php?f...ea98933cb7f891

My style sheet: (IE)
http://www.voobly.net/download.php?f...4822937f7d3227

My Header.php file:
http://www.voobly.net/download.php?f...1e693ab25ae0e1

Contact me on MSN: AKC_Pico********.com

Thankyou agian!