There is a bootostrap block with pictures of unknown size initially (can be any) 4 pieces, 1 row. How to align them in a row at all resolutions? cross-browser compatibility ie9+ feedl

 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> <section id="anchor" class="container"> <div class="col-md-3 col-sm-6 col-xs-6"> <a href="#new-tab"> <img src="http://placehold.it/67x67"> <p>подпись</p> </a> </div> <div class="col-md-3 col-sm-6 col-xs-6"> <a href="#calculator"> <img src="http://placehold.it/47x66"> <p>подпись</p> </a> </div> <div class="col-md-3 col-sm-6 col-xs-6"> <a href="#application"> <img src="http://placehold.it/92x67"> <p>подпись</p> </a> </div> <div class="col-md-3 col-sm-6 col-xs-6"> <a href="#guarantee"> <img src="http://placehold.it/58x70"> <p>подпись</p> </a> </div> </section>

    1 answer 1

    Place after the second block of the picture (div-a) such code in order to correct the problem of folding columns.

     <div class="clearfix visible-xs-block visible-sm-block"></div>

    Feedl

    You can read more on the official website of bootstrap