<p>The HTML in this demo is using the Svelte templating system to generate a bunch of fake dates. This makes it easier for you to see the essential HTML, but might confuse you if you don't know the syntax.</p>

<p>This CSS demo uses the grid system to create a 7 column grid, but <b>auto</b> rows.  You then just write each date as a tag and the grid does the rest for you.  You should also notice how I did the month display on the top:</p>

<pre>
<code class="language-css">
calendar month {
  grid-column: span 7;
}
</code>
</pre>

<p>When you're dealing with a regular grid like this it's easier to use numeric indexes, but I think for more complex layouts it's better to use the method in <a href="/#/demos/GridOverGraphic">GridOverGraphic</a> where you name the grid cells instead of using numbers.</p>