Трудности с версткой CSS, сайт ведет себя в Chrome, но не в Firefox

Question

У меня проблемы с браузерами на этом сайте, может кто-нибудь объяснить мне, почему он не работает в Firefox, а в Google Chrome, пожалуйста?

Когда изображение щелкается, текст в Firefox неправильно позиционируется

http://dl.dropbox.com/u/2306276/problem/index.html

Я думаю, что это как-то связано с

display: table;

но я не знаю почему.

спасибо

Answer 1

Измените эти биты вашего CSS:

div.container {
    height: 215px;
    line-height: 215px;
    width: 215px;
    text-align: center;
}

div.child {
    display: inline-block;
    margin: 0;
    position: relative;
    vertical-align: middle;
}

Обычно безопаснее избегать display: table-*, где это возможно.

Answer 2

Вы видите https://bugzilla.mozilla.org/show_bug.cgi?id=10209

Это также исправлено в ночных Firefox; исправление выйдет в Firefox 10.

Answer 3

попытайтесь установить "положение: относительное", это может работать