TableDemo

Two columns

Wrap all content to be displayed in columns inside <div class="grid-layout-two-column"> and wrap <div class="grid-layout-item"> around each column.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla imperdiet nisi eu lectus sodales pulvinar. Phasellus ac enim tempor, condimentum mi scelerisque, mollis sem. Ut varius malesuada semper.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla imperdiet nisi eu lectus sodales pulvinar. Phasellus ac enim tempor, condimentum mi scelerisque, mollis sem. Ut varius malesuada semper.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla imperdiet nisi eu lectus sodales pulvinar. Phasellus ac enim tempor, condimentum mi scelerisque, mollis sem. Ut varius malesuada semper.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla imperdiet nisi eu lectus sodales pulvinar. Phasellus ac enim tempor, condimentum mi scelerisque, mollis sem. Ut varius malesuada semper.

Three columns

Wrap all content to be displayed in columns inside <div class="grid-layout-three-column"> and wrap <div class="grid-layout-item"> around each column.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla imperdiet nisi eu lectus sodales pulvinar. Phasellus ac enim tempor, condimentum mi scelerisque, mollis sem. Ut varius malesuada semper.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla imperdiet nisi eu lectus sodales pulvinar. Phasellus ac enim tempor, condimentum mi scelerisque, mollis sem. Ut varius malesuada semper.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla imperdiet nisi eu lectus sodales pulvinar. Phasellus ac enim tempor, condimentum mi scelerisque, mollis sem. Ut varius malesuada semper.

Four columns

Wrap all content to be displayed in columns inside <div class="grid-layout-four-column"> and wrap <div class="grid-layout-item"> around each column.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla imperdiet nisi eu lectus sodales pulvinar. Phasellus ac enim tempor, condimentum mi scelerisque, mollis sem. Ut varius malesuada semper.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla imperdiet nisi eu lectus sodales pulvinar. Phasellus ac enim tempor, condimentum mi scelerisque, mollis sem. Ut varius malesuada semper.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla imperdiet nisi eu lectus sodales pulvinar. Phasellus ac enim tempor, condimentum mi scelerisque, mollis sem. Ut varius malesuada semper.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla imperdiet nisi eu lectus sodales pulvinar. Phasellus ac enim tempor, condimentum mi scelerisque, mollis sem. Ut varius malesuada semper.

Small screen grid

Add the.small-screen-grid class to any grid layout container for two-column layouts on small screens.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla imperdiet nisi eu lectus sodales pulvinar. Phasellus ac enim tempor, condimentum mi scelerisque, mollis sem. Ut varius malesuada semper.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla imperdiet nisi eu lectus sodales pulvinar. Phasellus ac enim tempor, condimentum mi scelerisque, mollis sem. Ut varius malesuada semper.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla imperdiet nisi eu lectus sodales pulvinar. Phasellus ac enim tempor, condimentum mi scelerisque, mollis sem. Ut varius malesuada semper.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla imperdiet nisi eu lectus sodales pulvinar. Phasellus ac enim tempor, condimentum mi scelerisque, mollis sem. Ut varius malesuada semper.

Share