How to align an image center inside div

HTML Blocks are elements established as a block-level element, which are created by using the <div> element.

The most common way to center blocks with CSS is to set both the left and right margins to auto. Here is the CSS:

<style>
  div.center {
    margin: auto;
  }
</style>

The most common way to center blocks with CSS is to set both the left and right margins to auto. Here is the CSS:

Reference:
https://www.w3.org/Style/Examples/007/center.en.html

How to vertical align an image inside an anchor

To vertical align an image inside an anchor, there are 3 necessary parts inside the CSS:

1. Your anchor should have same  height and inline-height.
2. Your image should have vertical-align: middle;
3. Your image should have display: inline-block;

<style>
    .thumbnail {
        width: 150px;
        height: 150px;
        text-align: center;
        line-height: 150px;
    }
    .thumbnail img {
        margin: auto;
        vertical-align: middle; 
    }  
</style>

Reference:
http://stackoverflow.com/questions/20700475/vertical-align-image-inside-an-anchor-with-css
http://plnkr.co/edit/b5jEtK5EWVglrhEkj14e?p=preview