Plaan — № 4

index.html

<header role="banner" class="sr-only">
	<h1>Plan de salle du «&nbsp;Cercle des poètes disparus&nbsp;»</h1>
</header>
<main role="main" style="--rows:4; --cols:7;">
	<ul role="presentation" class="no-list no-margin">
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
		<li role="presentation"></li>
	</ul>
	<ul class="no-list no-margin">
		<li>M. Keating</li>
		<li>Neil Perry</li>
		<li>Todd Anderson</li>
		<li>Knox Overstreet</li>
		<li>Charlie Dalton</li>
		<li>Richard Cameron</li>
		<li>Steven Meeks</li>
		<li>Gerard Pitts</li>
		<li>Hopkins</li>
		<li>Stick</li>
	</ul>
</main>
<aside role="complementary">
</aside>

plaan-4.markdown

Plaan — № 4

A Pen by ffoodd on CodePen.

License.

style.scss

[role="main"] {
  display: grid;
  gap: 1rem;
  grid-template: repeat(var(--rows, 4), 1fr) / repeat(var(--cols, 7), 1fr);
  height: 100vh;
  margin: 0;
  padding: 1rem;
  width: 100vw;
}

styles

<link href="https://ffoodd.github.io/sseeeedd/css/styles.min.css" rel="stylesheet" />
<link href="https://ffoodd.github.io/sseeeedd/css/print.min.css" rel="stylesheet" />