Need help with CSS issue in IE7!

HTML & CSS
1

Hi all,
This page I created seems to work correctly in all later browsers with the exception of IE7. There should be 4 columns of text, but IE7 is showing 3…and it is pushing the 4th column text down off the page.

If you have IE7, can you take a look and let me know what part of the CSS I should exit to fix this? Thank you, I’m out of ideas!!

http://ogmda.com/moh/alpha.html

2

Just a wild guess here, but IE7 may be having trouble translating the %widths into pixels. You could try reducing the width of the columns just a little for IE7. As a test, place this code at the bottom of your alpha.css style sheet:

*+html #group-one, *+html #group-two, *+html #group-three, *+html #group-four{
	width: 24%;
	float: left;
}
3

Or perhaps more easily allow for a 2px overlap on the last item only.


#group-four{margin-right:-2px}

Your container is 987px and doesn’t divide equally which means it has to be rounded up 4 times (as there is no such thing as a fraction of a pixel although good browsers do keep s running total) which gives IE 4 chances to get it wrong.