Multi Column Layout

You can create a multi-column layout in the content area of pages and content sections by using custom classes and div tags.  We have created a grid generator to make this process easier to use.

  1. The grid generator is located at http://mk033.monkpreview.com/grid-generator/
  2. Select the number of rows and then the column layout for each row. This will produce a code snippet that you can place into the editor of your page or content section
  3. Copy the code snippet and go to your page in the CMS.  You will need to use the "html view" option and paste in the code at the desired location.
  4. Switch to edit view and you can update the example content as needed (the grid generator will place a dummy image and text as a placeholder).

Your style guide page has an example of columns for review.

NOTE: If you would like to display an image inside a column at fullwidth of the column container you can add the class "responsive image" to the image tag.