JSFiddle - React, Tailwind, and code Playground

HTML

<table style="width: 455px; height: 4087px;" border="0">
<tbody>
<tr>
<td style="width: 200px;"><strong>What it's used for</strong></td>
<td style="width: 110px;"> <strong>Tag</strong></td>
<td style="width: 300px;"><strong>Example</strong></td>
</tr>
<tr>
<td><span class="wysiwyg-font-size-medium">Bold</span></td>
<td><span class="wysiwyg-font-size-medium">&lt;b&gt;</span></td>
<td style="width: 300px;">
<pre><span class="wysiwyg-font-size-small">&lt;b&gt;Help Suite&lt;/b&gt;</span></pre>
</td>
</tr>
<tr>
<td><span class="wysiwyg-font-size-medium">Paragraph</span></td>
<td>
<p><span class="wysiwyg-font-size-medium">&lt;p&gt;</span></p>
</td>
<td style="width: 300px;">
<pre><span class="wysiwyg-font-size-small">&lt;p&gt;This is a paragraph.&lt;/p&gt;</span></pre>
</td>
</tr>
<tr>
<td><span class="wysiwyg-font-size-medium">Italic</span></td>
<td><span class="wysiwyg-font-size-medium">&lt;i&gt;</span></td>
<td style="width: 300px;">
<pre><span class="wysiwyg-font-size-small">&lt;i&gt;Italic text&lt;/i&gt;</span></pre>
</td>
</tr>
<tr>
<td><span class="wysiwyg-font-size-medium">Strike</span></td>
<td><span class="wysiwyg-font-size-medium">&lt;s&gt;</span></td>
<td style="width: 300px;">
<pre><span class="wysiwyg-font-size-small">&lt;s&gt;strike out incorrect statements&lt;/s&gt;</span></pre>
</td>
</tr>
<tr>
<td><span class="wysiwyg-font-size-medium">Links</span></td>
<td><span class="wysiwyg-font-size-medium">&lt;a&gt;</span></td>
<td style="width: 300px;">
<pre><span class="wysiwyg-font-size-small">Link: &lt;a href="support.mindbodyonline.com"&gt;Help Suite&lt;/a&gt;</span></pre>
</td>
</tr>
<tr>
<td><span class="wysiwyg-font-size-medium">Images</span></td>
<td><span class="wysiwyg-font-size-medium">&lt;img&gt;</span></td>
<td style="width: 300px;">
<pre><span class="wysiwyg-font-size-small"><span class="highLT">&lt;</span><span class="highELE">img</span> <span class="highATT">src=</span><span class="highVAL">"</span>http://www.page.com/about<span...