Secure Checkout

Need assistance? Live Chat
877-754-6222 (US Only) | 402-697-1100

Test Elements

120 characters left

Email Type

I want to get emails about:


Grid Guide

Mobile Examples

This grid system is designed to be mobile first. Any grid unit specifications left without a media query specifiation (shown below) will be attributed to mobile. To fill a single column one would simply have "ls-unit-1" for all screen sizes.

Key

These two units are 50% at the medium screen width and above and will turn to 100% width on screen sizes under 768px (md)

ls-unit-1 / ls-unit-md-1-2
ls-unit-1 / ls-unit-md-1-2

The three units below are set to have 2, 25% columns and 1, 50% column. For mobile, the 25% columns (6-24) turn to 50% and the 1, 50% column turns to 100%.

ls-unit-6-24
ls-unit-6-24
ls-unit-1 / ls-unit-12-24

Grid Units

Full Row Grid Units

ls-unit-1 (use this for individual common row)
ls-unit-1-1
ls-unit-5-5
ls-unit-24-24

5ths-Based Units

ls-unit-2-5
ls-unit-3-5
ls-unit-1-5
ls-unit-4-5
ls-unit-5-5

24ths-Based Units

3rds
ls-unit-1-3
ls-unit-2-3

4ths
ls-unit-1-4
ls-unit-3-4

6ths
ls-unit-1-6
ls-unit-5-6

8ths
ls-unit-3-8
ls-unit-5-8
ls-unit-1-8
ls-unit-7-8

24ths
1
ls-unit-23-24
2
ls-unit-22-24
3
ls-unit-21-24
ls-unit-4-24
ls-unit-20-24
ls-unit-5-24
ls-unit-19-24
ls-unit-6-24
ls-unit-18-24
ls-unit-7-24
ls-unit-17-24
ls-unit-8-24
ls-unit-16-24
ls-unit-9-24
ls-unit-15-24
ls-unit-10-24
ls-unit-14-24
ls-unit-11-24
ls-unit-13-24
ls-unit-12-24
ls-unit-12-24
ls-unit-24-24