Preview Works

by Lex_85

HTML

<div id="PreviewWorks"><a href="#"><img src="http://img-fotki.yandex.ru/get/15584/221669934.0/0_139b59_ef1762fd_L.jpg" width="290" height="201" alt="0" border="0"></a><a href="#"><img src="http://img-fotki.yandex.ru/get/15584/221669934.0/0_139b59_ef1762fd_L.jpg" width="290" height="201" alt="0" border="0"></a><a href="#"><img src="http://img-fotki.yandex.ru/get/15584/221669934.0/0_139b59_ef1762fd_L.jpg" width="290" height="201" alt="0" border="0"></a><a href="#"><img src="http://img-fotki.yandex.ru/get/15584/221669934.0/0_139b59_ef1762fd_L.jpg" width="290" height="201" alt="0" border="0"></a></div>

CSS

*{-webkit-transition:all 0.2s ease;-moz-transition:all 0.2s ease;-o-transition:all 0.2s ease;transition:all 0.2s ease;box-sizing: border-box;}
img {width: 100%; height: auto; display: block;}
a {text-decoration: none;}

#PreviewWorks {width: 100%; background-color: #9F9}
#PreviewWorks a {width: 24.25%; margin: 0 1% 0 0; display: inline-block; background-color: black;}
#PreviewWorks a:hover img {opacity: 0.6;}
#PreviewWorks a:nth-child(4) {margin: 0}