Блок не отображается в Firefox

Question

Взгляните на это с IE или Chrome и обратите внимание на желтый блок: http://vansschoenenonline.com/portfolio/vans-era-goldcoast-ginger-bread/

Теперь откройте ту же страницу светлячок и волшебство происходит ... блок исчез.

Кто-нибудь знает, что вызывает это? Я сделал что-то не так?

Answer 1

просто удалить position:relative из .single-portfolio .entry-content класса и добавить эти свойства в вашем стиле left: 0; top: 314px; сНа, который держит «Goedkoopste магазина:» текст
это может помочь вам

Answer 2

Ваш HTML неверен:

<h5><h2>Goedkoopste shop:</h2></h5> 

Заголовки не могут быть вложенными, браузеры делают то, что им заблагорассудится с ошибками и каждый из них может быть различным.

http://validator.w3.org/check?uri=http%3A%2F%2Fvansschoenenonline.com%2Fportfolio%2Fvans-era-goldcoast-ginger-bread%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

Validation Выход: 2 Ошибки

Линия 154, Колонка 84: Заголовок не может быть потомком другого заголовка. …10px 0 -5px 3px;; margin-bottom:-5px;">Goedkoopste shop:</h2></h5><span style=…

Линия 154, столбец 111: Бродячие закрывающий тег h5. …ttom:-5px;">Goedkoopste shop:</h2></h5><span style="margin-left:3px;">Fresh Co…

Answer 3

Причины заключается в том, в style.css:

.single-portfolio .entry-content .entry-meta { 
    left: 0; 
    width: 220px; 
} 

.gecko.single-portfolio .entry-content .entry-meta { left: -240px; } 

Существует неясность, на каком left:xxx применении на вашем div.entry-meta. Firefox применяет последний, в отличие от Chrome и IE (возможно, они считают, что первый .gecko.single-portfolio делает все правило недействительным).

Если вы используете инструменты разработчика Firefox, вы увидите, что применяется одна из них: left: -240px;. Если вы снимете его, ваш блок будет виден, как в других браузерах.

Если вы удалите эту строку:

.gecko.single-portfolio .entry-content .entry-meta { left: -240px; } 

(или сделать так, чтобы она не применяется на данном этапе) будет хорошо