Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Screen reader accessible table for "Adversaries: A Beginner’s Guide to Combat" (https://wizardsunitehub.info/tips/adversaries-guide/)
<table style="border-collapse: collapse; width: 100%;">
<tbody>
<tr>
<th style="width: 33.3333%;"><strong>Foe</strong></th>
<th style="width: 29.885%;"><strong>Foe</strong></th>
<th style="width: 36.7816%;"><strong>Archfoe</strong></th>
</tr>
<tr>
<td style="width: 33.3333%;"><span style="color: #3366ff;">Common Serpent</span><span class="screen-reader-text"> (Magizoologists)</span></td>
<td style="width: 29.885%;"><span style="color: #ff0000;">Imposing Dark Wizard</span><span class="screen-reader-text"> (Aurors)</span></td>
<td style="width: 36.7816%;">Draco Malfoy</td>
</tr>
<tr>
<td style="width: 33.3333%;"><span style="color: #800080;">Imposing Snatcher</span><span class="screen-reader-text"> (Professors)</span></td>
<td style="width: 29.885%;"><span style="color: #800080;">Dangerous Werewolf</span><span class="screen-reader-text"> (Professors)</span></td>
<td style="width: 36.7816%;">Fenrir Greyback</td>
</tr>
<tr>
<td style="width: 33.3333%;"><span style="color: #800080;">Common Pixie</span><span class="screen-reader-text"> (Professors)</span></td>
<td style="width: 29.885%;"><span style="color: #800080;">Dangerous Pixie</span><span class="screen-reader-text"> (Professors)</span></td>
<td style="width: 36.7816%;">Gilderoy Lockhart</td>
</tr>
<tr>
<td style="width: 33.3333%;"><span style="color: #3366ff;">Formidable Serpent</span><span class="screen-reader-text"> (Magizoologists)</span></td>
<td style="width: 29.885%;"><span style="color: #3366ff;">Fierce Acromantula</span><span class="screen-reader-text"> (Magizoologists)</span></td>
<td style="width: 36.7816%;">Slytherin&#8217;s Basilisk</td>
</tr>
<tr>
<td style="width: 33.3333%;"><span style="color: #3366ff;">Common Acromantula</span><span class="screen-reader-text"> (Magizoologists)</span></td>
<td style="width: 29.885%;"><span style="color: #3366ff;">Fierce Acromantula</span><span class="screen-reader-text"> (Magizoologists)</span></td>
<td style="width: 36.7816%;">Aragog</td>
</tr>
<tr>
<td style="width: 33.3333%;"><span style="color: #ff0000;">Formidable Dark Wizard</span><span class="screen-reader-text"> (Aurors)</span></td>
<td style="width: 29.885%;"><span style="color: #ff0000;">Vicious Death Eater</span><span class="screen-reader-text"> (Aurors)</span></td>
<td style="width: 36.7816%;">Peter Pettigrew</td>
</tr>
<tr>
<td style="width: 33.3333%;"><span style="color: #800080;">Common Troll</span><span class="screen-reader-text"> (Professors)</span></td>
<td style="width: 29.885%;"><span style="color: #3366ff;">3-Headed Dog</span><span class="screen-reader-text"> (Magizoologists)</span></td>
<td style="width: 36.7816%;">Ancient Norwegian Ridgeback</td>
</tr>
<tr>
<td style="width: 33.3333%;"><span style="color: #ff0000;">Formidable Poacher</span><span class="screen-reader-text"> (Aurors)</span></td>
<td style="width: 29.885%;"><span style="color: #800080;">Vicious Mummy</span><span class="screen-reader-text"> (Professors)</span></td>
<td style="width: 36.7816%;">Ancient Ukrainian Ironbelly</td>
</tr>
<tr>
<td style="width: 33.3333%;"><span style="color: #3366ff;">Formidable Acromantula</span><span class="screen-reader-text"> (Magizoologists)</span></td>
<td style="width: 29.885%;"><span style="color: #800080;">Sphinx</span><span class="screen-reader-text"> (Professors)</span></td>
<td style="width: 36.7816%;">Ancient Hungarian Horntail</td>
</tr>
<tr>
<td style="width: 33.3333%;"><span style="color: #800080;">Formidable Snatcher</span><span class="screen-reader-text"> (Professors)</span></td>
<td style="width: 29.885%;"><span style="color: #ff0000;">Dark Witch</span><span class="screen-reader-text"> (Aurors)</span></td>
<td style="width: 36.7816%;">Narcissa Malfoy</td>
</tr>
</tbody>
</table>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment