I have album page - using Bootstrap
- List 6 albums
- On tablets, desktops: 3 albums/row
- On phones: 2 albums/row
Problem:
Loop 6 li tags
<li class="col-xs-6 col-sm-4">IMAGE 01</li>
<li class="col-xs-6 col-sm-4">IMAGE 02</li>
<li class="col-xs-6 col-sm-4">IMAGE 03</li>
<li class="col-xs-6 col-sm-4">IMAGE 04</li>
<li class="col-xs-6 col-sm-4">IMAGE 05</li>
<li class="col-xs-6 col-sm-4">IMAGE 06</li>
Solution:
Add clearfix with extra condition
<li class="col-xs-6 col-sm-4">IMAGE 01</li>
<li class="col-xs-6 col-sm-4">IMAGE 02</li>
<li class="col-xs-6 col-sm-4">IMAGE 03</li>
<li class="clearfix hidden-xs"></li>
<li class="col-xs-6 col-sm-4">IMAGE 04</li>
<li class="col-xs-6 col-sm-4">IMAGE 05</li>
<li class="col-xs-6 col-sm-4">IMAGE 06</li>