Fix github pages table jitter

Use grid, since tables are old and janky.

type: documentation
This commit is contained in:
Casey Rodarmor 2020-01-31 09:05:20 -08:00
parent 9ff627c29f
commit 3f91f042c7
No known key found for this signature in database
GPG Key ID: 556186B153EC6FE0
2 changed files with 42 additions and 47 deletions

View File

@ -26,17 +26,16 @@ a {
text-decoration: none;
}
table {
border-collapse: collapse;
#intermodal {
display: grid;
grid-template-columns: repeat(5, 1fr);
margin-bottom: var(--margin-vertical);
margin-left: var(--margin-horizontal);
margin-right: var(--margin-horizontal);
margin-top: var(--margin-vertical);
}
td {
border-style: dashed;
border-width: 1px;
#intermodal > * {
height: var(--size);
width: var(--size);
}

View File

@ -8,22 +8,18 @@
</head>
<body>
<a href="https://github.com/casey/intermodal">
<table>
<tr>
<td id="i"></td>
<td id="n"></td>
<td id="t"></td>
<td id="e"></td>
<td id="r"></td>
</tr>
<tr>
<td id="m"></td>
<td id="o"></td>
<td id="d"></td>
<td id="a"></td>
<td id="l"></td>
</tr>
</table>
<div id="intermodal">
<div id="i"></div>
<div id="n"></div>
<div id="t"></div>
<div id="e"></div>
<div id="r"></div>
<div id="m"></div>
<div id="o"></div>
<div id="d"></div>
<div id="a"></div>
<div id="l"></div>
</div>
</a>
</body>
</html>