css menu resize problem in ie8

hello,i have a horizontal menu bar that works in full screen but if you resize the screen then teh menu bar goes to the right. I have tried to get it to work but just cant seem to do it. Can anyone help me with this headache please, many thanks in advance:-cssul#menu { margin-left:155px !important; padding:0; list-style-type:none; width:948px; position:relative;overflow:hidden display:block; height:40px; font-size:12px; font-weight:bold; background:#CC0000; font-family:Arial, Helvetica, sans-serif; border-bottom:1px solid #000000; border-top:1px solid #000000;float:left;margin-bottom:30px;white-space:nowrap;}ul#menu li { display:block; float:left; margin:0; padding:0;} ul#menu li a{ display:block; float:left; color:#F9F7ED; text-decoration:none; font-weight:bold; padding:30px 30px 30 30px;} ul#menu li a:hover{ color:#F9F7ED; height:15px; background:#ff0000;border-bottom:2px solid #4096EE; } ul#menu li a.current {display:inline; height:15px; background:#cecece; float:left;margin:0px 0 0px o;}html-

• About me
• Pictures
• Stuff
• misc
• About me
• pictures
• stuff
• misc

 

I see a few things.

1. You are giving it a margin of 155 pixels to the left
2. You are setting a width of 948 pixels

If you want to center it, put the following instead of a margin-left:

cssul#menu {
    margin: 0px auto;
}

Code (markup):

This will center the menu in your browser, even when you change the width.