Доброго!
Как сделать стили, чтобы при уменьшении экрана сжимает картинки, в последствии переносит их на след. строку.

Делается в bootstrap
<div class="container gallery">
<div class="col-lg-12">
<a href=""><img src="img/photo_01.jpg" alt="" class="img-responsive"></a>
<a href=""><img src="img/photo_02.jpg" alt="" class="img-responsive"></a>
<a href=""><img src="img/photo_03.jpg" alt="" class="img-responsive"></a>
<a href=""><img src="img/photo_04.jpg" alt="" class="img-responsive"></a>
<a href=""><img src="img/photo_05.jpg" alt="" class="img-responsive"></a>
<a href=""><img src="img/photo_06.jpg" alt="" class="img-responsive"></a>
</div>
<div class="col-lg-12">
<a href=""><img src="img/photo_01.jpg" alt="" class="img-responsive"></a>
<a href=""><img src="img/photo_02.jpg" alt="" class="img-responsive"></a>
<a href=""><img src="img/photo_03.jpg" alt="" class="img-responsive"></a>
<a href=""><img src="img/photo_04.jpg" alt="" class="img-responsive"></a>
<a href=""><img src="img/photo_05.jpg" alt="" class="img-responsive"></a>
<a href=""><img src="img/photo_06.jpg" alt="" class="img-responsive"></a>
</div>
</div>
.img-responsive {
display: block;
max-width: 100%;
height: auto;
}
Изрбражения не сжимаются, а сразу переносят на джругую строку, оставляю сбоку пространство ненужное.