在IE6＆amp; 7

Question

我正在我的网站上工作，我正在所有浏览器中测试它，我喜欢除了IE 6＆amp; 7我一直在做我最近的工作室。我知道很多人不觉得支持IE 6是值得的，但它在IE 7中做的完全相同。所以我必须看到最新情况。

我最近的工作图库应该有2行3列，但在IE 6＆amp; 7它有3行2列我尝试了一些变化，但它看起来仍然相同。

这就是它在IE 6＆amp; 7

这就是它在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">
        <a href="#"><img src="images/recentwork-imageWH.jpg" alt="HOME GALLERY" /></a>
    </div>

    <div class="galleryItem">
        <a href="#"><img src="images/recentwork-imageWH.jpg" alt="HOME GALLERY" /></a>
    </div>

    <div class="galleryItem">
        <a href="#"><img src="images/recentwork-imageWH.jpg" alt="HOME GALLERY" /></a>
    </div>

    <div class="galleryItem">
        <a href="#"><img src="images/recentwork-imageWH.jpg" alt="HOME GALLERY" /></a>
    </div>

    <div class="galleryItem">
        <a href="#"><img src="images/recentwork-imageWH.jpg" alt="HOME GALLERY" /></a>
    </div>

    <div class="galleryItem">
        <a href="#"><img src="images/recentwork-imageWH.jpg" alt="HOME GALLERY" /></a>
    </div>
</div>
</div>

你知道发生了什么吗？ 任何帮助表示赞赏！

Answer 1

我认为这可能是你的问题

width: 29.33333%;

尝试将其降低至25％并查看其功能。有时填充和边框在某些浏览器上比其他浏览器大几个像素。如果可以，那么慢慢向上递增，直到它在IE7中工作