I attempted to implement bootstrap in my entire project, but I encountered an issue where it only seemed to work for the heading tag and not for the other elements. Below are the codes I used:
<div class="container">
<div class="col-md-12">
<form class="form-horizontal templatemo-create-account templatemo-container" enctype="multipart/form-data" role="form" action="" method="post">
<div class="form-inner">
<center><em><h2>New Cumulative Deposit Account</h2></em></center>
<div id="cum_app_info">
<center> <h3> Personal Information </h3></center>
<table class="table table-striped">
<tr>
<td> <label for="cumfirstapp" class="control-label">First Applicant</label> </td>
<td> <input type="text" name="first_app" id="first_app" required class="form-control" value=""> </td>
<td> <label for="cumfirstappid" class="control-label">Member Id</label> </td>
<td> <input type="text" name="first_cum_app_id" id="first_cum_app_id" required class="form-control" value=""> </td>
</tr>
<tr>
<td> <label for="cumsecondapp" class="control-label">Second Applicant</label> </td>
<td> <input type="text" name="second_app" id="second_app" class="form-control" value=""> </td>
<td> <label for="cumsecondappid" class="control-label">Member Id</label> </td>
<td> <input type="text" name="second_cum_app_id" id="second_cum_app_id" class="form-control" value=""> </td>
</tr>
<tr>
<td colspan="4"><input type="submit" name="cum_app_next" class="btn btn-info" id="cum_app_next" value="Next" />
</td>
</tr>
</table>
</div>
</div>
</form>
</div>
</div>