title: Centre image in a DIV
body: <p>There are numerous discussionsn on SO but I've tried suggestions without success. I have a DIV within which I need an image, whose height and width are unknown, to be centered horizontally and vertically.</p>
  
  <p>I also need this multiple times so I don't want to have to add more CSS code each time.</p>
  
  <p>Here's what I have in terms of CSS and HTML for the DIV.</p>
  
  <pre><code>.gallery_image_container {
      position: relative;
      width: 830px;
      height: 500px;
      z-index: 7;
      border: solid 4px #EAEAEA;
      background-image:url(bottom_back.png);
  }
  </code></pre>
  
  <p>and </p>
  
  <pre><code>&lt;div class="gallery_image_container"&gt;
  &lt;img src="image.png" /&gt;
  &lt;/div&gt;
  </code></pre>