IE7 margin issue

[xpdesigns]

I was hoping to get some advice on a issue I am only seeing In IE7. I needed to create a new menu for this particular website so I used position:absolute within the header DIV. Basically what is happening is that this absolute positioned div is being pushed outside of the sites main wrapper.



Please take a look at the top navigation on http://www.shapesbrowbar.com

Thank you in advance

[SB65]

Have a try with:

#header {
    background-color: #313131;
    height: 95px;
    padding: 0;
    width: 960px;
   position:relative
}

#top-nav {
    color: #FFFFFF;
    font-family: arial;
    font-size: 13px;
    /*margin-left: 470px;*/
    margin-top: 13px;
    position: absolute;
    right: 43px;
}

Setting position:relative on #header sets the starting point for the absolute positioning consistently for all browsers.

[xpdesigns]

Thank you so much for this code.. It seems to work great for the top menu I created.. For some reason it is still however breaking my social-media roll over div that is positioned to the right of the top-nav..

It works fine in everything but IE7

shapesbrowbar.com

Thank you again for any advice