Gallery not viewing right in IE6 & 7 - css

Question

I'm working on my website and I'm testing it out in all browsers and I love everything except the one thing IE 6 & 7 have been doing to my recent work gallery. I understand a lot of individuals don't feel supporting IE 6 is worth it however it's doing the exact same thing in IE 7 too. So I have to see whats going on.
My recent work gallery is supposed to have 2 rows and 3 columns, however in IE 6 & 7 it has 3 rows and 2 columns and I've tried some changes but it still looks the same.
This is how it looks in IE 6 & 7
This is how it looks in IE 8
CSS
![#RECENTWORK-WRAPPER {
width: 100%;
background: url(../images/irongrip.png) repeat;
color: #fff;
clear: both;
}
.RECENTWORK-CONTAINER {
width: 95%;
max-width: 1040px;
margin: 0 auto;
overflow: hidden;
/*border: 1px solid #000;*/
}
.galleryItem {
color: #797478;
font: 10px/1.5 Verdana, Helvetica, sans-serif;
float: left;
}
.galleryItem h3 {
text-transform: uppercase;
}
.galleryItem img {
max-width: 100%;
padding: 3px;
border: 1px solid #fff;
}
.galleryItem {
color: #797478;
font: 10px/1.5 Verdana, Helvetica, sans-serif;
float: left;
width: 29.33333%;
margin: 2% 2% 30px 2%;
}]
HTML
<div id="RECENTWORK-WRAPPER">
<div class="RECENTWORK-CONTAINER">
<h3><span>Recent Work</span></h3>
<div class="galleryItem">
<img src="images/recentwork-imageWH.jpg" alt="HOME GALLERY" />
</div>
<div class="galleryItem">
<img src="images/recentwork-imageWH.jpg" alt="HOME GALLERY" />
</div>
<div class="galleryItem">
<img src="images/recentwork-imageWH.jpg" alt="HOME GALLERY" />
</div>
<div class="galleryItem">
<img src="images/recentwork-imageWH.jpg" alt="HOME GALLERY" />
</div>
<div class="galleryItem">
<img src="images/recentwork-imageWH.jpg" alt="HOME GALLERY" />
</div>
<div class="galleryItem">
<img src="images/recentwork-imageWH.jpg" alt="HOME GALLERY" />
</div>
</div>
</div>
Do you know what is going on?
Any help is appreciated!

Answer 1

I think this might be your problem
width: 29.33333%;
Try taking that down to like 25% and see what it does. Sometimes padding and borders are a few pixels bigger on some browsers than others. If that works, then slowly increment it upward until it works in IE7