Галерея не просматривается прямо в IE6 & 7 - PullRequest
Новая
       3

Галерея не просматривается прямо в IE6 & 7

0 голосов
/ 05 февраля 2012

Я работаю над своим сайтом и тестирую его во всех браузерах, и мне нравится все, кроме одной вещи, которую IE 6 и 7 делал с моей недавней рабочей галереей. Я понимаю, что многие люди не чувствуют, что поддержка IE 6 стоит того, но в IE 7 она делает то же самое. Поэтому я должен посмотреть, что происходит.

Моя недавняя рабочая галерея должна иметь 2 строки и 3 столбца, однако в IE 6 и 7 она имеет 3 строки и 2 столбца, и я попробовал некоторые изменения, но она все еще выглядит так же.

Вот как это выглядит в IE 6 и 7 This is how it looks in IE 6 & 7

Вот так это выглядит в IE 8 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">
        <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>

Вы знаете, что происходит? Любая помощь приветствуется!

1 Ответ

0 голосов
/ 05 февраля 2012

Я думаю, что это может быть вашей проблемой 

width: 29.33333%;

Попробуйте понизить это до 25% и посмотреть, что он делает. Иногда отступы и границы в некоторых браузерах на несколько пикселей больше, чем в других. Если это работает, то постепенно увеличивайте его, пока он не заработает в IE7

...