Question

Hey guys I am having trouble styling my navigation so that is will always be at the same position on a page no matter the browser….

I have the following:

#Mainmenu {
    width: 44%;
    font-family: Helvetica, Arial, Sans-Serif;
    font-weight: bold;
    font-size: .9em;
    list-style: none;
    position: absolute;
    left: 35em;
    top: 4.7em;
    right: 0;   

}

This is positioned, exacly where I want it in chrome and firefox but not in IE. Also if I change resolution it changes the positioning a little. I want to know how I can always have it at the same spot it is suppose to.

Let me know if you need anything else!

David

update:

http://jsfiddle.net/MVpkP/ – is the styles that I have in it and the layout.

The one above this is Chrome and the one I want it to remain like, that’s how I want it styled.

Answer 1

Put this in your header

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

Create an additional css file for IE and adjust your IE css accordingly.