Strange Appearance

Thank the lord for IE8, all kind of strange things. I would solvbe this with a seperate css with some extra margin

Fix this with the UL-tag there is a -1 em top margin, change this to 0px

The UL has a margin of -1em, which IE 7 is not liking very much. Remove the -1em margin and that should be solved.

you should have different css for each browser

<!-- all IE -->
<!--[if IE]>
<link href="http://www.yourdomain.com/ggf-styles-ie.css" rel="stylesheet" type="text/css" />
<![endif]-->
 
<!-- for IE 5 only -->
<!--[if IE 5]>
<link href="http://www.yourdomain.com/ggf-styles-ie.css" rel="stylesheet" type="text/css" />
<![endif]-->  
 
<!-- for less than IE 8, excluding version 8 -->
<!--[if lt IE 8]>
<link href="http://www.yourdomain.com/ggf-styles-ie.css" rel="stylesheet" type="text/css" />
<![endif]-->

To add to what abosboom and LZ1 said, as an alternative to removing the negative top margin, giving "position:relative" to the element should help.

Also the page contains some XHTML errors which should be corrected: http://validator.w3.org/


@mattibutt  IE-only stylesheets are not needed to fix every little display issue in IE.

different stylesheet does help in long term so each time you have a consistency problem you dont have to follow unify convention instead please the browser for that specific portion where problem persist

One question of you all.

Why do I not see the issue when I look at it in IE 8?

Thanks

Because each new version of IE has had more CSS bugs fixed than the previous version. If you set IE8 to display the page in "Compatibility View" then it will give you a good idea of how IE7 would display it.


@mattibutt  IE-only stylesheets can also mask underlying problems and make debugging more difficult in the future.

to answer your question IE8 is a new release and it addresses old bugs from IE7
thanks

To all,

I created a different <ul> in the css (see attached css & html). The customers says it's the same. The customer is using IE 7. The new style has the -1em top margin removed.

Did I do the css / html wrong?
main-test.css
memb-menu-norm.htm