JSFiddle - React, Tailwind, and code Playground
by Martin Sjåstad
HTML
<div class="part-content">
<form action="http://simplesaml.sucroo.com/club/join/20" method="post" accept-charset="utf-8" id="club-form">
<table>
<tbody><tr>
<td>
<label for="student_id">Student ID number<span class="required">*</span></label>
</td>
<td>
<input type="text" name="student_id" id="student_id" value="" placeholder="">
</td>
</tr>
<tr>
<td>
<label for="student_disc">Student Association Card Holder</label>
</td>
<td>
<input type="checkbox" name="student_disc" id="student_disc" value="1">
<em>*if yes, you will be required to show your card
when collecting your club membership card</em>
</td>
</tr>
<tr>
<td>
<label for="mobile">Mobile number<span class="required">*</span></label>
</td>
<td>
<input type="text" name="mobile" id="mobile" value="" placeholder="">
</td>
</tr>
<tr class="submit-form-action">
<td colspan="2" align="right">
<input type="submit" id="" name="submit" class="btn btn-dark_blue btn-auto_width" value="Complete Payment">
</td>
</tr>
</tbody></table>
</form> </div>
CSS
#club-form input:not([type="submit"], #student_disc),
#club-form textarea,
#club-form select
{
width: 500px;
}