Below are examples of column classes that are available with the Genesis Framework parent theme:
Two-Columns
This is the Genesis “one-half” column class, which makes dividing your content in half simple. It’s a great way to present content side-by-side. Note that with these classes, once the screensize falls below a certain resolution (eg. mobile), they will automatically moved to a stacked-layout, rather than side-by-side.
When you use a two column layout with different content sizes, you’ll want to add an element that clears the content below both those columns. This is done by creating a div element with a “clear-line” class (similar to the “clear:both;” CSS property). We’ve done this in all the examples on this page, but you can’t see it unless you use inspect-element or view-source.
Three-Columns
Just like the two-column layout, the three-column layout uses a – you guessed it – “one-third” class. How simple is that? You’ll want to minimize the use of this class to provide a visual break to your content, and only when using full-width pages. Keep the text short and snappy, like a call to action or to feature three options side-by-side.
This is an example of a WordPress post, you could edit this to put information about yourself or your site so readers know where you are coming from. You can create as many posts as you like in order to share with your readers what is on your mind.
This is an example of a WordPress post, you could edit this to put information about yourself or your site so readers know where you are coming from. You can create as many posts as you like in order to share with your readers what is on your mind.
Four-Columns
This is the “one-fourth” class that can be applied to elements such as divs and spans. It’s generally too thin to present content in a properly readable format, especially when there are sidebars present, but it’s there for you to use if you want it.
This is an example of a WordPress post, you could edit this to put information about yourself or your site so readers know where you are coming from. You can create as many posts as you like in order to share with your readers what exactly is on your mind.
This is an example of a WordPress post, you could edit this to put information about yourself or your site so readers know where you are coming from. You can create as many posts as you like in order to share with your readers what exactly is on your mind.
This is an example of a WordPress post, you could edit this to put information about yourself or your site so readers know where you are coming from. You can create as many posts as you like in order to share with your readers what exactly is on your mind.
Most of the time, you’re going to just want to use the regular full-width layout for your content. This is especially true with food blogs, where you want to break the content up with images and a recipe plugin. Gutenberg’s layout editor will undoubtedly cause some issues with the one-half, one-third and one-fourth classes.
