<p>A standard typographic hierarchy for structuring your webpages.</p>
<p>The entire typographic grid is based on two Less variables in our preboot.less file: <code>@basefont</code> and <code>@baseline</code>. The first is the base font-size used throughout and the second is the base line-height.</p>
<p>The entire typographic grid is based on two Less variables in our preboot.less file: <code>@baseFontSize</code> and <code>@baseLineHeight</code>. The first is the base font-size used throughout and the second is the base line-height.</p>
<p>We use those variables, and some math, to create the margins, paddings, and line-heights of all our type and more.</p>
</div>
<divclass="span4">
...
...
@@ -467,7 +467,7 @@
</div>
</div>
<p><strong>Note:</strong> Each line in an <code><address></code> must end with a line-break (<code><br /></code>) or be wrapped in a block-level tag (e.g., <code><p></code>) to properly structure the content.</p>
<p><strong>Note:</strong> Each line in an <code><address></code> must end with a line-break (<code><br></code>) or be wrapped in a block-level tag (e.g., <code><p></code>) to properly structure the content.</p>
<h3>Abbreviations</h3>
<p>For abbreviations and acronyms, use the <code><abbr></code> tag (<code><acronym></code> is deprecated in <abbrtitle="HyperText Markup Langugage 5">HTML5</abbr>). Put the shorthand form within the tag and set a title for the complete name.</p>
<dd>A description list is perfect for defining terms.</dd>
...
...
@@ -592,7 +592,7 @@
<tbody>
<tr>
<td><code><code></code></td>
<td>In a line of text like this, your wrapped code will look like this <code>>html<</code> element.</td>
<td>In a line of text like this, your wrapped code will look like this <code><html></code> element.</td>
</tr>
<tr>
<td><code><pre></code></td>
...
...
@@ -1263,10 +1263,10 @@
</div>
<divclass="span4">
<h4>Dropdowns included</h4>
<p>As part of the main navigation, we’ve included the ability for you to add dropdowns to your nav. Check out the secondary nav above (right aligned) to see how it’s done. Dropdowns <code>li</code> tags also support <code>.active</code> for showing current page selection.</p>
<p>As part of the main navigation, we’ve included the ability for you to add dropdowns to your nav. Check out the secondary nav above (right aligned) to see how it’s done. Dropdowns <code><li></code> tags also support <code>.active</code> for showing current page selection.</p>
</div>
</div>
<p><strong>Note:</strong> When using the topbar on any page, be sure to account for the overlap it causes by adding <code>padding-top: 40px;</code> to your <code>body</code>.</p>
<p><strong>Note:</strong> When using the topbar on any page, be sure to account for the overlap it causes by adding <code>padding-top: 40px;</code> to your <code><body></code>.</p>