Centered Изображение в DIV

Question

CSS:

overlay { 
    height: 100%; 
    width: 100%; 
    position: absolute; 
    top: 0px; 
    left: 0px; 
    z-index: 99999; 
    background-color:black; 
    filter: alpha(opacity=75); 
    -moz-opacity: 0.75; 
    opacity: 0.75; 
} 
overlay h2 { 
    position: fixed; 
    margin-left: 40%; 
    top: 40%; 
    font-size: 1.75em; 
    font-weight:700; 
    color:#EF9C00; 
} 

HTML:

<div id="overlay"><h2>Loading.. Please wait</h2></div> 

Я хотел бы к loader.png появляться непосредственно под словами на следующей строке по центру. Все, что я пытаюсь, похоже, помещает изображение поверх текста или справа от него!

Благодаря

Answer 1

Right IMG загрузки:

<div id="overlay"><h2>Loading.. Please wait <img src="http://jimpunk.net/Loading/wp-content/uploads/loading23.gif" /></h2></div> 

добавить CSS

#overlay img { 
    vertical-align:middle; 
} 

Следующая линия по центру IMG загрузки:

<div id="overlay"> 
    <h2> 
    Loading.. Please wait <br /><img src="http://jimpunk.net/Loading/wp-  content/uploads/loading23.gif" /> 
    </h2> 
</div> 

Добавить CSS

#overlay h2 { 
     text-align:center; 
}