JSFiddle - React, Tailwind, and code Playground
by JonNorman
HTML
<link rel="stylesheet" href="http://absoluteme.co.uk/wp-content/themes/absoluteme/css/reset.css">
<div id="prev_show_hide_fields"><div id="spacer_consultation" class="clear"></div><div class="leftside specify_treatment">
<label for="pods_form1_specify_treatment">Please specify which treatment you had at this clinic</label>
</div><div class="rightside specify_treatment">
<input type="hidden" value="" class="form specify_treatment hidden" name="specify_treatment"><input type="text" value="" class="form txt specify_treatmentHelper" id="specify_treatment"><div class="prev_specify_treatment_autocompleteHelper"></div><style>
.prev_specify_treatment_autocompleteHelper{
border: 1px solid #DEDEDE;
padding: 3px 5px;
position: absolute;
z-index:1000;
background-color:#ffffff;
display:none;
}
.prev_specify_treatment_autocompleteHelper ul{
list-style :none;
margin:0px;
}
.prev_specify_treatment_autocompleteHelper ul li:hover{
background-color: #CECECE;
}
</style>
</div><div id="spacer_specify_treatment" class="clear"></div><div class="leftside product_name">
<label for="pods_form1_product_name">Do you know the name of the product that was used?</label>
</div><div class="rightside product_name">
<input type="text" maxlength="128" value="" id="pods_form1_product_name" class="form txt product_name pods_field pods_field_product_name pods_coltype_txt" name="product_name">
</div><div id="spacer_product_name" class="clear"></div><div class="rightside Initial_analysis" style="width: 80px;">
<select style="display:none;" id="pods_form1_Initial_analysis" class="form pick1 Initial_analysis pods_field pods_field_Initial_analysis pods_coltype_pick" name="Initial_analysis">
<option value="">-- Select one --</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
...