<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <fieldset> <!-- Form Name --> <legend>Patient receipt</legend> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="usrname">Name</label> <div class="col-md-4"> <input id="usrname" name="usrname" type="text" placeholder="Enter name" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="d_id">Doctor ID</label> <div class="col-md-4"> <input id="d_id" name="d_id" type="text" placeholder="Enter Doctor's ID" class="form-control input-md"> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="r_id">Receptionist ID</label> <div class="col-md-4"> <input id="r_id" name="r_id" type="text" placeholder="Enter Receptionist's ID" class="form-control input-md"> </div> </div> <!-- Button Drop Down --> <div class="form-group"> <label class="col-md-4 control-label" for="med">Add medicines</label> <div class="col-md-4"> <div class="input-group"> <input id="med" name="med" class="form-control" placeholder="Add medicines" type="text"> <div class="input-group-btn"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> ADD <span class="caret"></span> </button> <ul class="dropdown-menu pull-right"> <li><a href="#">Option one</a></li> <li><a href="#">Option two</a></li> <li><a href="#">Option three</a></li> </ul> </div> </div> </div> </div> <!-- Textarea --> <div class="form-group"> <label class="col-md-4 control-label" for="diag">Diagnosis</label> <div class="col-md-4"> <textarea class="form-control" id="diag" name="diag"></textarea> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="amt">Total amount</label> <div class="col-md-4"> <input id="amt" name="amt" type="text" placeholder="" class="form-control input-md"> </div> </div> <!-- Button --> <div class="form-group"> <label class="col-md-4 control-label" for="print_bill"></label> <div class="col-md-4"> <button id="print_bill" name="print_bill" class="btn btn-primary">Print Bill</button> </div> </div> </fieldset> </form>