<div class="grid--blog">
<header class="header">My header</header>
<article class="content">
<h1>Using negative space</h1>
<p>This example uses line-based positioning, to position the header and footer, stretching them across the grid.</p>
<p>By making the content span a number of rows, we can then space the blocks out next to that content. Each in their own row.</p>
</article>
<div class="block-a">Block A</div>
<div class="block-b">Block B</div>
<div class="block-c">Block C</div>
<footer class="footer">My footer</footer>
</div>
<div class="grid--blog">
<header class="header">My header</header>
<article class="content">
<h1>Using negative space</h1>
<p>This example uses line-based positioning, to position the header and footer, stretching them across the grid.</p>
<p>By making the content span a number of rows, we can then space the blocks out next to that content. Each in their own row.</p>
</article>
<div class="block-a">Block A</div>
<div class="block-b">Block B</div>
<div class="block-c">Block C</div>
<footer class="footer">My footer</footer>
</div>
{
"name": "Blogs"
}
No notes defined.