Images at the bottom of the div

by Krzysztof Niecikowski

HTML

<div class="cover"><a href="#"><img src="http://placehold.it/70x30/aa0000"></a></div>
<div class="cover"><a href="#"><img src="http://placehold.it/50x30/ffffff"></a></div>
<div class="cover"><a href="#"><img src="http://placehold.it/30x70/ffff00"></a></div>
<div class="cover"><a href="#"><img src="http://placehold.it/30x30/ff0000"></a></div>
<div class="cover"><a href="#"><img src="http://placehold.it/30x100/fff000"></a></div>
<div class="cover"><a href="#"><img src="http://placehold.it/20x150/ff00ff"></a></div>
<div class="cover"><a href="#"><img src="http://placehold.it/30x70/cccc00"></a></div>
<div class="cover"><a href="#"><img src="http://placehold.it/30x90/fddff0"></a></div>

CSS

body {background-image: url(http://image.bayimg.com/oaddpaaea.jpg); background-repeat: repeat;}
.cover {  
    float: left; 
    height: 258px;
    line-height: 258px;  
    border: 1px solid red; 
    margin: 0px 5px 25px 5px;
}
.cover img {
    vertical-align: bottom; 
    border: 1px solid green; 
    -webkit-box-shadow: 0 8px 6px -6px black; 
    -moz-box-shadow: 0 8px 6px -6px black; 
    box-shadow: 0 8px 6px -6px black;
}