Как сохранить изображение в центре страницы независимо от размера окна браузера?

Question

Я хочу сделать это, используя только CSS + HTML. Он должен работать во всех основных/последних браузерах, а не в IE 6.

код у меня выглядит следующим образом:

<div id="left_arrow"> 
     <img src="images/left-arrow.png"> 
    </div> 

#left_arrow { 
    position: absolute; 
    left: 0px;   
    margin: 10px 0 15px 0; /* top, right, bottom, left */ 
    padding: 5px 5px 7px 5px; /* top, right, bottom, left */ 
} 

Я попытался сделать позицию как «абсолютное», но если изменяет размер окна браузера, стрелка не двигается, и я хочу, чтобы всегда быть на центра браузера, независимо от размера.

Edit:

Я хочу, чтобы всегда быть в центре этого DIV:

<div id="images" width="100%"> 
     <img src="image1.jpg" width="45%"> 
     <img src="image2.jpg" width="45%"> 
</div> 

Это весь блок кода, который он находится в пределах:

<div id="compare_view" align="center"> 

    <div id="compv-navbar"> 
     <a href="#"><img src="icon1.png" id="icon1"></a> | 
     <a href="#"><img src="icon2.png" id="icon2"></a> | 
     <a href="#"><img src="icon3.png" id="icon3"></a> | 
     <span id="view_name"> text </span> 
    </div> 

    <div id="left_arrow"> 
     <img src="images/left-arrow.png"> 
    </div> 

    <div id="right_arrow"> 
     <img src="images/right-arrow.png"> 
    </div> 

    <div id="images" width="100%"> 
     <img src="image1.jpg" width="45%"> 
     <img src="image2.jpg" width="45%"> 
    </div> 

    <div id="notice"> 
     Notice will be here. 
    </div> 

</div> 

Редактировать 2: Если нет решения для CSS, решение jQuery также прекрасное.

Редактировать 3: все еще нет берущих? bump

Answer 1

У меня была успешная работа с использованием «text-align: center» для горизонтального центрирования. Для вертикальной центровки, попробуйте следующее:

.vBox {min-height: 12em; display: table-cell; vertical-align: middle; } 

<div class="vBox"> <p>Lorem Ipsum is simply dummy text </p> </div> 

Приветствия, Erik