Hello Team, I'm trying to make a custom sheet for my own system, but I have completely 0 skills in HTML and CSS so I'm learning as I go. Here are 2 things that I can't really find answers for online. 1) How do I center this god damn checkbox in "Known" column. 2) How do you make a clickable text. I want it to work like in 5e sheet where you can click "Arcana" and make a roll, instead of a separate button and also highlight on hover. As you can see there is a "transparent" button there already, I can add text there even, but the "roll" icon is always present. Here is my HTML <div class="sheet-section-title-bar sheet-text-align-center">Academic Skills</div>
<table class="sheet-subsection-table">
<tr>
<!-- header row -->
<th>Known</th>
<th>Skill Name</th>
<th>Prof.</th>
<th>Bonus</th>
<th>Total</th>
</tr>
<tr>
<!-- start of row -->
<td>
<input type="checkbox" name="attr_arcana_prof" value="@{prof}" />
</td><td style="vertical-align:middle;">
<div class="sheet-big-bold-saving-throw">Arcana</div>
</td><td style="vertical-align:middle;">
<input type="checkbox" name="attr_arcana_prof" value="@{prof}" />
</td><td style="vertical-align:middle;">
<input class="sheet-numbox" type="number" name="attr_arcana_base" min="-5" step="1" value="-3" />
</td><td style="vertical-align:middle;">
<input class="sheet-numbox" type="number" name="attr_arcana_bonus" value="@{arcana_base}+@{arcana_prof}" disabled="disabled"/>
</td><td style="vertical-align:middle; border: none;">
<button class="sheet-roll-button" type="roll" value="&{template:check} {{name=Arcana}} {{check=[[1d20 + @{arcana_bonus}]]}} {{checkadv=[[1d20 + @{arcana_bonus}]]}}" /></button>
</td>
<tr>
</tr>
<!-- end of row -->
</tr>
</table> I will skip over the CSS since I bet you don't need it here. Thanks in advance!
