CSS alignment issue. IE only. A little help?

[tannercampbell]

http://designucation.com/develop

You’ll see what I mean. If you look at this in CHROME, FF or SAFARI all lines up fine, but in IE (even 9) the slider is below it’s assigned location (barely). It might be worth it to point out that the grey border that’s there is part of the background for that div and not part of the ul/li hierarchy that makes up the slider.

Any ideas here?

Thanks,
Tanner Campbell

[noahgelman]

hmm…. try adding line-height:0 to #slides

[Historical Forums User]

I don’t see any resets at the beginning of the css for margin, padding and even borders. I would check that and see if it makes a difference… Then, I would also check to see if you need to use ol, ul (for your menu class or id) {display:list-item ;} – only for ie

I also noticed that if you go into compatibility mode on the site, Contact disappears all together.

[drake]

– ul tag is a block element so there is no need to use an enclosing div.

ul {
list-style:none;
overflow:hidden;
zoom:1;
margin:0 25px;
font:normal 14px/45px arial,helvetica,sans-serif;
background:url(images/menubar.png) 0 0 repeat-x;
padding: 0 30px;
}

– don’t add style to the li tags, just display inline

– use padding and margins on the tags to position the menu items within the menubar and float them left

[drake]

Sorry, the last sentence should say ‘anchor tags’

[Author]

Posts