<p>Columns each contain gutters giving them equal vertical spacing from other columns. Columns by default do not take up their entire row height.</p>
<p>A grid will automatically center any columns that do not match a full row width.</p>
<divclass="ui three column grid">
<divclass="column">
<divclass="ui segment">
@ -286,8 +285,7 @@ type : 'UI Collection'
<p>A grid can be responsive to a browsers width. This means the gutters to left and right of grid columns will alter in size as a browser's resolution increases.</p>
<divclass="ui text message info ignore">
<p>
<iclass="icon heart"></i> Semantic UI's responsive grid by default will change the page gutters to increase at 250pixel intervals.
<iclass="icon heart"></i> Semantic UI's responsive grid by default will change the page gutters to increase at 250pixel intervals.
</div>
<divclass="ui two column responsive grid">
@ -393,6 +391,9 @@ type : 'UI Collection'
<divclass="example">
<h4class="ui header">Stackable Grid</h4>
<p>A grid can have its columns take a full column width when below a threshold to allow for content to display properly at small sizes</p>
<divclass="ui text message info ignore">
<iclass="icon heart"></i> To see a grid stack, try resizing your browser to a small width
</div>
<divclass="two column stackable ui grid">
<divclass="column">
<divclass="ui segment">
@ -694,7 +695,7 @@ type : 'UI Collection'
</div>
</div>
</div>
</div>
<divclass="example">
<h4class="ui header">Column Width</h4>
<p>A column can span across multiple grid columns.</p>