Align image in center and middle within div

html css

Dro1n2 · Feb 3, 2011 · Viewed 1.1M times · Source

I have following div

<div id="over" style="position:absolute; width:100%; height:100%>
 <img src="img.png">
</div>

How to align the image so as to be located in the middle and center of div ?

Answer

body {
  margin: 0;
}

#over img {
  margin-left: auto;
  margin-right: auto;
  display: block;
}

<div id="over" style="position:absolute; width:100%; height:100%">
  <img src="http://www.garcard.com/images/garcard_symbol.png">
</div>