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

#html #css #firefox #google-chrome #positioning

#HTML #css #firefox #google-chrome #позиционирование

Вопрос:

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

При нажатии на изображение текст в Firefox позиционируется неправильно

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

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

 display: table;
 

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

Спасибо

Комментарии:

1. Пожалуйста, опубликуйте здесь соответствующий код и опишите, что именно не работает

2. Я разместил сайт, вы можете использовать firebug, чтобы увидеть код. Я описал проблему, «текст расположен неправильно», чего еще вы хотите? Это дальше вниз и влево, а иногда и вправо, чем должно быть?

Ответ №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-* , где это возможно.

Комментарии:

1. Фантастика, большое спасибо за это @Eric, работает отлично. Я использовал «display: table» для «сжатия» div, и я пытался использовать «display: inline-block;» но это вызвало проблему с выравниванием. еще раз большое спасибо.

Ответ №2:

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

Это также исправлено в Firefox nightlies; исправление будет поставляться в Firefox 10.

Ответ №3:

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