bootstrap 4

by lovromar

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
 <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.1.0/css/bootstrap-combined.min.css" rel='stylesheet' type='text/css' />
<div class="container">
  <div class="row-fluid">
  	<ul class="thumbnails">
    	<li class="span3 span-control">
        	<a href="#" class="thumbnail"><img src="http://2.bp.blogspot.com/-7mZbQgDR674/T9hMg1ijGYI/AAAAAAAABF8/S9nKCcCvH6A/s1600/free-stock-photos-Vacation-to-Bora-bora-beach.jpg" alt=""></a>
        </li>
        <li class="span3">
        	<a href="#" class="thumbnail"><img src="http://2.bp.blogspot.com/-7mZbQgDR674/T9hMg1ijGYI/AAAAAAAABF8/S9nKCcCvH6A/s1600/free-stock-photos-Vacation-to-Bora-bora-beach.jpg" alt=""></a>
        </li>
        <li class="span3 span-control">
        	<a href="#" class="thumbnail"><img src="http://2.bp.blogspot.com/-7mZbQgDR674/T9hMg1ijGYI/AAAAAAAABF8/S9nKCcCvH6A/s1600/free-stock-photos-Vacation-to-Bora-bora-beach.jpg" alt=""></a>
        </li>
        <li class="span3">
        	<a href="#" class="thumbnail"><img src="http://2.bp.blogspot.com/-7mZbQgDR674/T9hMg1ijGYI/AAAAAAAABF8/S9nKCcCvH6A/s1600/free-stock-photos-Vacation-to-Bora-bora-beach.jpg" alt=""></a>
        </li>
    </ul>
  </div>
  <!-- .row -->
</div>
<!-- .container -->

CSS

@media screen and (max-width: 767px) { 

.row-fluid [class*="span"] {
    float: left !important;
    width: 42% !important;
	margin-left: 4% !important;
}
.span-control{
	margin-left:0 !important;
}

}

@media screen and (max-width: 480px) { 

.row-fluid [class*="span"] {
    float: none !important;
    width: 100% !important;
	margin-left: 0 !important;
}

}