Multiple screen sizes13 Mar 2018 in: Grid System
Handling layout changes for multiple screen sizes is as simple as adding a few more classes to your markup.
screen- tablet- mobile- phone-
<div class="row double-gutters"> <div class="columns screen-60 tablet-50 mobile-40 phone-100"> ... </div> <div class="columns screen-40 tablet-50 mobile-60 phone-100"> ... </div> </div>
To set the width of a grid column just add the desired width percentage class for the targeted breakpoint:screen-50 mobile-100