Do your eyes glaze over when talking about website grids? Never fear--CMS makes it easy. This website actually uses two grids, but the first grid system--the four-column CMS grid--is the one used most often. The exception is the 12-column Foundations grid system used with the Variable Columns snippet and the behind-the-scenes page layout. You can learn more about it in snippets section.
4-Column CMS Grid
When designing in the CMS, you'll pick your column widths in the page properties tab for each section you want turned on. The columns available are: one, two, three, four, large-small and small-large. To see what one, two, three and four columns look like on a page, visit the page types. You can also see what small-large looks like over in the image placement page.
12-Column Foundations Grid
The biggest thing you need to know about this grid system is that when calling out certain size columns, they always equal 12. This framework is for any device, medium and accessibility. Foundation is a family of responsive front-end frameworks that make it easy to design beautiful responsive websites for any device. Foundation is semantic, readable, flexible and completely customizable grid system.