Клиент недавно сообщил о проблеме со своим веб-сайтом. Они запускают Firefox в качестве своего единственного браузера, и неожиданно, примерно неделю назад, Firefox начал показывать некоторые плавающие ящики на своем веб-сайте странным образом (вставляя пустое пространство во второй ряд ящиков). С тех пор я проанализировал источник и не могу понять, что вызывает проблему - он корректно отображается во всех других браузерах, и он отображался правильно в Firefox до примерно недели назад. За это время никаких изменений в источнике не было.Плавающие ящики в Firefox
Webkit Скриншот - http://postimg.org/image/jow77ae7b/
Firefox Скриншот - http://postimg.org/image/5txwotjs7/
Это вполне может быть просто случаем необходимости нового набора глаз. CSS для класса "галерея ящика", который применяется к каждой из коробок, показанных, приведена ниже:
HTML
<div class="gallery-grid">
<div class="gallery-box">
<div class="gallery-box-content">
Content of box...
</div>
</div>
<!-- Repeat <div class="gallery-box"></div> -->
</div>
CSS
.gallery-box {
float: left;
width: 33.33%;
overflow: hidden;
display: inline-block;
}
Спасибо заранее за любую помощь, даю высокую оценку!
Я считаю, что float заставляет элемент быть «блоком», поэтому «display: inline-block» ничего не сделает. Но это не ваша проблема. – Leeish
Можете ли вы показать HTML вокруг предметов тоже? Просто CSS действительно недостаточно. – Leeish
Это справедливый вопрос. Я только добавил «display: inline-block» сегодня вечером, чтобы выяснить, устранила ли он проблему, после того как она была опубликована как потенциальное исправление для другой плавающей проблемы в Firefox. Это не помогло, поэтому я снова удалю его. –