Screw floats, so equip your website with a flex-based CSS layout for that perfect responsive design we all know and love.
For in-depth documentation, head over to the docs.
Bare Bones uses CSS's flex property, giving you the ability of a flex item to alter its dimensions to consume the space around it.
The grid system is comprised of a percent-based column layout, classes prefixed with .flex-c-. To ensure a cohesive layout, create a .flex-row class and embed as many columns as desired so long as they add up to 100.
Example:
<div class="flex-wrap">
<div class="flex-row">
<div class="flex-c-33">33%</div>
<div class="flex-c-33">33%</div>
<div class="flex-c-33">33%</div>
</div>
</div>
Bare Bones was developed by Michael Ferrell and with small but impactful tweaks by Dylan Grafmyre.