Различное расположение изображений между Chrome и Firefox - PullRequest
0 голосов
/ 08 февраля 2012

У меня есть два изображения, которые я хочу поместить прямо друг на друга. Этот HTML генерируется скриптом очень часто, поэтому я включил CSS непосредственно в сам HTML.

<div style="text-align:center">
<img id="background" 
style="position: absolute; z-index: 1; " 
src="background.png"/>
<img id="foreground" 
style="position: relative; z-index: 10; " 
src="foreground.png" border="0" usemap="#map"/>
</div>

Работает отлично, кроме Chrome. В Firefox и Internet Explorer это работает 100% времени, я могу сидеть и нажимать обновить, и это нормально. В Chrome иногда при загрузке страницы или обновлении фоновое изображение кажется смещенным на 50% вправо? Я только что сделал быстрый тест, и 5/10 раз (в половине случаев) он казался смещенным вправо при обновлении. У кого-нибудь есть идеи, что может быть причиной этого?

1 Ответ

1 голос
/ 15 февраля 2012

Предполагая, что ваши передний план и фоновые изображения имеют одинаковый размер, кажется, что вы пытаетесь сделать это:

<img id="foreground" style="margin-left:auto; margin-right:auto; background:url(&quot;background.png&quot;);" src="foreground.png" usemap="#map"/>

margin-left:auto; margin-right:auto; будет центрировать изображение в пределах родительского элемента.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...