Div containers provide a great way to format content into stackable columns to help users scan and consume it quickly. The CMS provides multiple options when setting up divs.

Use divs if you have distinct groups of content that can be visually separated by whitespace.

Do not use divs for paragraphs of body copy.

Tips for using divs:

  • Always test on mobile. How divs are split impacts how they stack on mobile.
  • Keep each section uniform in length: Divs will create awkward white space if one paragraph is running much longer than the others.
  • Get visual. Divs can also be used to align photos with white space around them.

If images are used to add visual interest in divs, contextual links and descriptive copy should be placed below the images. 

How to add Div Containers

Div Container Examples

This is a 1/2 div container.

This is a 1/2 div container.

This is a 1/3 div container.

This is a 2/3 div container.

This is a 1/3 div container.

This is a 1/3 div container.

This is a 1/3 div container.

This is a 1/4 div container.

This is a 1/4 div container.

This is a 1/4 div container.

This is a 1/4 div container.