Turn elements on your site into a responsive unified grid.
bower install basicFit
basicFit requires jQuery >= 2.1.0
####1. Include the files
<script async type="text/javascript" src="bower_components/jQuery/dist/jquery.min.js"></script>
<script async type="text/javascript" src="bower_components/basicFit/dist/basicFit.min.js"></script>
####2. Build a simple structure
<div id="content">
<div class="element"></div>
<div class="element"></div>
<div class="element"></div>
<div class="element"></div>
</div>
####3. Set a margin and max-min-width
#content {
display: inline-block;
margin: 0 0 20px 0;
}
.element {
float: left;
margin: 20px 0 0 20px;
min-width: 300px;
max-width: 500px;
background-color: #000;
}
####4. Initialize basicFit
basicFit.init '#content', '.element'
####5. Refresh after adding a new element
$('#content').append element
basicFit.refresh()