Как мне настроить этот средний образ?

Question

У меня возникли проблемы с центрированием среднего изображения ... проверенный маркер: 0 авто, пробовал встроенный блок и т. Д., Что я забыл здесь?

Необходимо решение, которое будет работать на всех браузерах.

JS скрипку:

http://jsfiddle.net/NuFtA/3/

вот CSS:

.class2{ 
margin-left: auto; 
margin-right: auto; 
} 

.class3{ 
float:right; 

Answer 1

Если вы можете повторно организовать HTML для:

<img src="http://placehold.it/350x400" class="class1" width="100" /> 
<img src="http://placehold.it/350x400" class="class3" width="100" /> 
<img src="http://placehold.it/350x400" class="class2" width="100" /> 

Тогда этот CSS будет делать :

.class1 { 
    float:left; 
} 
.class2 { 
    margin-left: auto; 
    margin-right: auto; 
    width:100px; 
    display:block; 
} 
.class3 { 
    float:right; 
} 

jsFiddle example

Answer 2

JSFIDDLE

HTML

<div class="image_container"> 
    <img src="http://placehold.it/350x400" class="image class1" /> 
    <img src="http://placehold.it/350x400" class="image class2" /> 
    <img src="http://placehold.it/350x400" class="image class3" /> 
</div> 

CSS

.image_container { 
    position: relative; 
    text-align: center; 
} 

.image { 
    position: absolute; 
    width: 100px; 
} 

.class1{ 
    left: 0; 
} 

.class2{ 
    margin-left: -50px; /* Half of the image's width*/ 
} 

.class3{ 
    right: 0; 
}