Basic Section/Row/Column

A gathering of Sections/Rows/Columns to play with. Description of each is within each row as appropriate.

  • Sections(Blue)
  • Rows(Red)
  • Columns(Orange/Green) — if you create additional columns in any row the new columns backgrounds will be transparent and will show the row colour (red)since you are looking through the transparency.

The following 3 classes need to be added to the page's CSS or to your site's Customizer if you want it to look a bit clearer.

.basic-section {min-height: 500px;}

.basic-row {min-height: 300px;}

.basic-column {min-height: 200px;}

The layout below is a typical 'default' section with a single row and single column.
As above, with two columns.
This is identical but the row has had the inner container has been turned off.
The row's inner container is still off and we now have also turned on marginless columns from within the row.
The row's inner container is back on and marginless columns are still active from within the row.