One of the other powerful things you can do with the grid is nest the grid inside itself as many times as you like. For example, if you want to use all the 12 columns for the header and footer of your project, but you also want the middle content area to have a sidebar and a content area, you set the middle row to have 4 columns and 8 columns. This is fine because they add up to 12, but inside the 8 columns, you want to have an introductory paragraph that takes up the entire width. Under this paragraph, you want to have two columns of content. You would create another row with another with two columns of 6 divs. Here is how the code will look for the middle content area:
<div class="row">
<div class="large-4 columns">Sidebar</div>
<div class="large-8 columns">
<p>Paragraph of content</p>
<div class="row">
<div class="large-6 columns">6 Columns</div>
<div class="large-6 columns">6 Columns<...