Chrome / IE проблема с абсолютным позиционированием нескольких div с изображениями

Question

Прямо сейчас я помогаю другу воплотить идею о том, чтобы отображать различные изображения одежды внутри коробки 400x400.

У меня возникла проблема с использованием абсолютно расположенных элементов div (outfit-box-брюки,-fit-box-shirts и т. д.), которые содержат изображения одежды внутри родительского div (outfit-box) с положением, установленным на относительное.На Firefox все мои div'ы выстраиваются корректно, и сайт отображается так, как должен.Но в IE и Chrome мои дивиденды абсолютной позиции создают беспорядок на всей странице.

Проблема, похоже, заключается в том, что IE / Chrome назначают какое-то позиционирование остальным моим div-элементам, что приводит к тому, что они все сокращаются.Что происходит?

Редактировать: проблема решена!

Answer 1

В ваших тегах изображений отсутствует закрывающий тег (/>).

                <div class="outfit-box-shoes">
                    <img src="http://preview.archerandreed.com/images/outfits/large/shoes-001.png" />
                </div>                    
                <div class="outfit-box-shirt">
                    <img src="http://preview.archerandreed.com/images/outfits/large/shirt-001.png" />
                </div>                    
                <div class="outfit-box-pants">
                    <img src="http://preview.archerandreed.com/images/outfits/large/pants-001.png" />
                </div>                    

Как только я добавлю их, изображения выстроятся в очередь для меня (http://jsfiddle.net/sSRVe/9/).

Answer 2

Я посмотрел на это в Firefox 5. Там тоже беспорядок ...

Я думаю, вам нужно смотреть на это с помощью firebug.Например, он говорит, что у вас есть файл "styles.css", который переопределяет .outfix-box-брюк, чтобы быть слева: 1px, top 1px.(строка 297)

Итак, на самом деле все отображается именно так, как вы его определили.

Возможно, вы захотите либо удалить ссылку на http://preview.archerandreed.com/styles.css, либо исправить ее.

Теперь, что касается того, почему ваш Firefox отображается правильно, я бы сказал, что он кэширован, а вы не смотрите текущую копию.