r four column grids. These are set by adding the respective grid modifier of either:</p>

<ul>
<li><code>u-grid--3</code> or</li>
<li><code>u-grid--4</code>.</li>
</ul>

<p><img src="http://cu-rds.s3.amazonaws.com/docs/assets/cardgrid-cols.png" alt="Showing 3 and 4 grid column options" /></p>

<h4 id="three-column-grid-code-example">Three column grid code example</h4>

<pre><code class="html">&lt;section class="u-block u-block--grey"&gt;
    &lt;h2&gt;Base example&lt;/h2&gt;
    &lt;div class="b-cardgrid u-