SO http://bit.ly/180j6fF - Vertically align images with tables

by panchroma

HTML

<div id="parent2">
    <div id="child2">
<img src="http://placehold.it/250X150" class="left">
        </div>
    </div>
    <div id="parent">
    <div id="child">
<img src="http://placehold.it/300x350" class="left">
        </div>
    </div>

CSS

#parent, #parent2 {display: table;
width:45%;
}
#parent2{
    float:right;
}


#child, #child2 {
    display: table-cell;
    vertical-align: middle;
}  
  
#child2{
    float:right;
}
@media (max-width: 570px) {
    #parent {
    line-height: normal;
}

#parent img {
margin:0 auto;
    display:block;
}

.image-wrap{
    background-color:#ffc;
    display:inline;
    float:none;
}

}