I'm trying to style 2 HTML tables differently but nothing I've tried is working. Here's a screenshot of my super basic testing flow:
And here is the entire contents of the "Create 2 HTML tables styled differently" step:
<style>
#services table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
#signature table, th, td {
border: 1px solid red;
border-collapse: collapse;
}
</style>
<div id="services" class="output">
<table>
<thead>
<tr>
<th>table header</th>
</tr>
</thead>
<tbody>
<tr>
<td>table contents</td>
</tr>
</tbody>
</table>
</div>
<br>
<div id="signature" class="output">
<table>
<thead>
<tr>
<th>table header</th>
</tr>
</thead>
<tbody>
<tr>
<td>table contents</td>
</tr>
</tbody>
</table>
</div>
I found this post on the topic, but it doesn't matter if I try "#services" or ".services", the CSS applied to both tables is only the second CSS code (the "#signature" section above):
Has anyone managed to do this successfully in the last 4 years since that other post?
