How do I force a table inside an html block to be rendered as a table?

[Amiroo.f]

What I’m trying to do

I have a table withing an html tag, similar to what I have below:

<div>

| Header 1 | Header 2 |
| -------- | -------- |
| Text 1   | Text 2   |

</div>

Which results to the screenshot below when cursor is on the table:

and this when the cursor is not on the table:

[dawni]

You won’t be able to make a markdown table inside of HTML in Obsidian, unless you find some plugin that makes it possible. No Markdown inside HTML - Obsidian Help

One options is to make everything HTML:

<div>

<table>
  <thead>
    <tr>
      <th>a</th>
      <th>b</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>a1</td>
      <td>b1</td>
    </tr>
  </tbody>
</table>

</div>

Another option could be to make everything markdown, using a custom callout to serve whatever purpose your div serves, if feasible.