I'm getting odd behavior with HTML lately - new-ish issue

[tikijimmy]

I have a daily note template that has a simple, 3-cell table at the top that renders as a “nav-bar” with the date in the middle, and a link to previous/next day’s notes on either side. It has worked fine for more than a year. Here’s what it looks like in Preview mode:

The new issue is- in Edit/Live Preview mode, the table breaks after the second cell, and it looks like this:

I’m not sure when this broke (I fell out of a daily note habit for a couple months), but I know it wasn’t always the case. Live Preview used to render the table just fine.

Here’s the HTML:

<table class="datenav">
<tr>
<td class="dn-l"><a href="2023-01-01.md" class="internal-link">❮</a></td>
<td class="dn-c"><h1>Mon Jan 2, 2023</h1></a></td>
<td class="dn-r"><a href="2023-01-03.md" class="internal-link">❯</a></td>
</tr>
</table>

and the CSS:

.datenav {
   	width: 100%;
    border-radius: 5em;
	background-color:#eee;
	text-align: center;
	overflow: hidden;
	color: red;
}

.dn-l a {
	width: 10%;
	font-size: 2.5em;
	text-decoration: none;
	color: red;
	padding: 1em;
}

.dn-c {
	width: 80%;
}

.dn-c h1 {
		color: red;
}

.dn-r a{
	width: 10%;
	font-size: 2.5em;
	text-decoration: none;
 	padding: 1em;
	color: red; 	
}

I’ve tried disabling all community plugins to see if there was a conflict, and that didn’t change anything.

Is this a rendering bug, or an issue with my HTML/CSS? Any ideas appreciated.

[CawlinTeffid]

@tikijimmy

</h1></a>

You close an a tag that you never opened. I don’t think that should break a table, but apparently it does in Live Preview (I tested on iOS).

[tikijimmy]

of course it’s something dumb I missed. I’ve been staring at it too long! Thanks!

[CawlinTeffid]

It happens to the best of us!