<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!-- Special version of Bootstrap that only affects content wrapped in .bootstrap-iso --> <link rel="stylesheet" href="https://formden.com/static/cdn/bootstrap-iso.css" /> <!-- Inline CSS based on choices in "Settings" tab --> <style>.bootstrap-iso .formden_header h2, .bootstrap-iso .formden_header p, .bootstrap-iso form{font-family: Arial, Helvetica, sans-serif; color: black}.bootstrap-iso form button, .bootstrap-iso form button:hover{color: white !important;} .asteriskField{color: red;}</style> <!-- HTML Form (wrapped in a .bootstrap-iso div) --> <div class="bootstrap-iso"> <div class="container-fluid"> <div class="row"> <div class="col-md-6 col-sm-6 col-xs-12"> <form method="post"> <div class="form-group "> <label class="control-label requiredField" for="name"> Medication <span class="asteriskField"> * </span> </label> <input class="form-control" id="name" name="name" placeholder="panadol etc." type="text"/> <span class="help-block" id="hint_name"> what medication is required </span> </div> <div class="form-group" id="div_checkbox1"> <label class="control-label " for="checkbox1"> Check all that apply </label> <div class=" "> <label class="checkbox-inline"> <input name="checkbox1" type="checkbox" value="Taken as Needed"/> Taken as Needed </label> <label class="checkbox-inline"> <input name="checkbox1" type="checkbox" value="Taken as Scheduled"/> Taken as Scheduled </label> <label class="checkbox-inline"> <input name="checkbox1" type="checkbox" value="With Food"/> With Food </label> <label class="checkbox-inline"> <input name="checkbox1" type="checkbox" value="On Empty Stomach"/> On Empty Stomach </label> </div> </div> <div class="form-group" id="div_Schedule"> <label class="control-label " for="Schedule"> When to take them </label> <div class=" "> <label class="checkbox-inline"> <input name="Schedule" type="checkbox" value="Breakfast"/> Breakfast </label> <label class="checkbox-inline"> <input name="Schedule" type="checkbox" value="Lunch"/> Lunch </label> <label class="checkbox-inline"> <input name="Schedule" type="checkbox" value="Dinner"/> Dinner </label> <label class="checkbox-inline"> <input name="Schedule" type="checkbox" value="Bedtime"/> Bedtime </label> <label class="checkbox-inline"> <input name="Schedule" type="checkbox" value="Custom"/> Custom </label> <span class="help-block" id="hint_Schedule"> Check all that apply </span> </div> </div> <label class="control-label " for="Dosage"> Dosage </label> <div class="form-inline"> <div class="input-group"> <div class="input-group-addon"> Take </div> <input class="form-control" id="Dosage" name="Dosage" placeholder="2 pills" type="text"/> </div> <div class="input-group"> <div class="input-group-addon"> Every </div> <input class="form-control" id="Dosage" name="Dosage" placeholder="6 hours" type="text"/> </div> <span class="help-block" id="hint_Schedule"> Please double check dosage information. </span> </div> <div class="form-group "> <label class="control-label " for="text1"> Additional Information </label> <input class="form-control" id="text1" name="text1" placeholder="taken upside down while wearing a tutu" type="text"/> <span class="help-block" id="hint_text1"> Any further instructions </span> </div> <div class="form-group"> <div> <button class="btn btn-primary " name="submit" type="submit"> Submit </button> </div> </div> </form> </div> </div> </div> </div>