{SOLVED}Can't fix placement of the menu in IE 7 (and IE 8){/SOLVED}

[reidjazz]

Hello all,
I've been porting the site http://alhoodtrumpet.com/cms/ and am all done, except I can't get the menu to display correctly in IE 7 and 8. It looks fine on all Mac browsers and in Firefox on Windows, but I'm struggling with the CSS to get it right in IE.

Can any of you CSS gurus possibly lend a hand? I would be most appreciative.

Thanks,
reidjazz

[KO]

try...

#menuwrapper {
  position: relative !important;
  top: 45px !important;
  left: 0px !important;
  margin: 0px 0 0 45px !important;
  margin: 0 0 0 -8px;;
  width: 130px;
  text-align: left;
  font-size: 1em;
 
}

/* Unless you know what you do, do not touch this */
#primary-nav, #primary-nav ul {
  list-style: none;
  padding: 0px;
margin:0;

}

This raises page a bit but you could compensate that for example in...

.home {
width: 768px;
height: 510px;
background: transparent url(uploads/images/main.jpg) 0 0 no-repeat;
margin: 60px auto 30px;
padding: 0px;
}

[reidjazz]

I'll give this a try and let you know how it turns out.

Thank you very much!!!
reidjazz

[reidjazz]

try...

#menuwrapper {
  position: relative !important;
  top: 45px !important;
  left: 0px !important;
  margin: 0px 0 0 45px !important;
  margin: 0 0 0 -8px;;
  width: 130px;
  text-align: left;
  font-size: 1em;
 
}

/* Unless you know what you do, do not touch this */
#primary-nav, #primary-nav ul {
  list-style: none;
  padding: 0px;
margin:0;

}

This raises page a bit but you could compensate that for example in...

.home {
width: 768px;
height: 510px;
background: transparent url(uploads/images/main.jpg) 0 0 no-repeat;
margin: 60px auto 30px;
padding: 0px;
}

OK, for the most part, this did it...thank you very much!! I just had to a make an adjustment using

Code: Select all

!important

to account for IE 6.

Now I can finally go live with the site!

Many thanks,
reidjazz

[KO]

I think IE6 ignores !important part. So if you set 2 margins and first one has !important still second one will be respected by IE6. All the other modern browsers use the one with !important. This is nice if you need to build stylesheet that validates and need to give different styles for IE6.