Bootstrap Left Panel Menu

This code snippet is for Bootstrap left panel menu.

<html>
<head>
<title></title>
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="css/style.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="http://code.jquery.com/jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" media="screen" href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css">
<script type="text/javascript" src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.min.js">
</script>
<script type="text/javascript" src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.pt-BR.js">
</script>
<script type="text/javascript">
$(function() {
$('#datetimepicker3').datetimepicker({
pickDate: false
});
});
</script>
<style type="text/css">
.add-on {
height: 30px !important;
cursor: pointer !important;
}
.container {
margin-left: 0px !important;
}
</style>
</head>
<body>
<div class="container">
<div class="col-sm-2">
<nav class="nav-sidebar">
<ul class="nav tabs">
<li class="active"><a href="#tab1" data-toggle="tab">Attendence</a></li>
<li class=""><a href="#tab2" data-toggle="tab">start time</a></li>
<li class=""><a href="#tab3" data-toggle="tab">Training materials</a></li>
</ul>
</nav>
</div>
<div class="tab-content">
<div class="tab-pane active text-style" id="tab1">
<h2><u>Attendence</u></h2>
<div id="chk" style="overflow: auto; max-height: 500px;"> <input type="hidden" value="2810000157" id="hdnschdateid"> <input type="CHECKBOX" value="2070007641" name="emp"> Mr. KUMAR (11035)<br> <input type="CHECKBOX" value="2070007800" name="emp"> Mr. D K (11433)<br> <input type="CHECKBOX" value="2070009953" name="emp"> Mr. KUMAR TIWARI (14887)<br> <input type="CHECKBOX" value="2070009966" name="emp"> Mr. KUMAR KORI (14900)<br> <input type="CHECKBOX" value="2070011131" name="emp"> Mr. SHARMA (16229)<br> <input type="CHECKBOX" value="2070012799" name="emp"> Mr. BABUSANAP (16402)<br> <input type="CHECKBOX" value="2070012950" name="emp"> Mr. SinghBohra (17570)<br> <input type="CHECKBOX" value="2070013204" name="emp"> Mr. Nanthakumar (17856)<br> <input type="CHECKBOX" value="2070015457" name="emp"> Mr. Sharma (20117)<br> <input type="CHECKBOX" value="2070015604" name="emp"> Mr. Khan Savanur (18490)<br> <input type="CHECKBOX" value="2070016345" name="emp"> Mr. Devtalla (20158)<br> <input type="CHECKBOX" value="2070018649" name="emp"> Mr. Varshney (20869)<br> <input type="CHECKBOX" value="2070018923" name="emp"> Mr. Johri (21116)<br> <input type="CHECKBOX" value="2070019348" name="emp"> Mr. Gaikwad (21568)<br> <input type="CHECKBOX" value="2070019796" name="emp"> Mr. Khanduri (22010)<br> <input type="CHECKBOX" value="2070019921" name="emp"> Mr. Chauhan (22132)<br> <input type="CHECKBOX" value="2070019953" name="emp"> Mr. Sahu (22164)<br> <input type="CHECKBOX" value="2070007641" name="emp"> Mr. KUMAR (11035)<br> <input type="CHECKBOX" value="2070007800" name="emp"> Mr. D K (11433)<br> <input type="CHECKBOX" value="2070009953" name="emp"> Mr. KUMAR TIWARI (14887)<br> <input type="CHECKBOX" value="2070009966" name="emp"> Mr. KUMAR KORI (14900)<br> <input type="CHECKBOX" value="2070011131" name="emp"> Mr. SHARMA (16229)<br> <input type="CHECKBOX" value="2070012799" name="emp"> Mr. BABUSANAP (16402)<br> <input type="CHECKBOX" value="2070012950" name="emp"> Mr. SinghBohra (17570)<br> <input type="CHECKBOX" value="2070013204" name="emp"> Mr. Nanthakumar (17856)<br> <input type="CHECKBOX" value="2070015457" name="emp"> Mr. Sharma (20117)<br> <input type="CHECKBOX" value="2070015604" name="emp"> Mr. Khan Savanur (18490)<br> <input type="CHECKBOX" value="2070016345" name="emp"> Mr. Devtalla (20158)<br> <input type="CHECKBOX" value="2070018649" name="emp"> Mr. Varshney (20869)<br> <input type="CHECKBOX" value="2070018923" name="emp"> Mr. Johri (21116)<br> <input type="CHECKBOX" value="2070019348" name="emp"> Mr. Gaikwad (21568)<br> <input type="CHECKBOX" value="2070019796" name="emp"> Mr. Khanduri (22010)<br> <input type="CHECKBOX" value="2070019921" name="emp"> Mr. Chauhan (22132)<br> <input type="CHECKBOX" value="2070019953" name="emp"> Mr. Sahu (22164)<br> </div>
<div class="col-md-12"> <a id="btnsubmit" style="margin-left: 59em;" onclick="attendencesubmit()" class="btn btn-primary" href="#">submit</a> </div>
</div>
<div class="tab-pane text-style" id="tab2">
<h4>start time</h4>
<div id="datetimepicker3" class="input-append"> <input data-format="hh:mm" class="form-control" style="height:30px; width:20%;" type="text" /> <span class="add-on">
<i data-time-icon="icon-time" data-date-icon="icon-calendar">
</i>
</span> </div>
<h4> Remarks</h4> <input type="text" style="height:40px; width:50%;" placeholder="Remarks" class="form-control" /> </div>
<div class="tab-pane text-style" id="tab3">
<h2>Training materials</h2>
<div class="list-group"> <a href="#" style="cursor:pointer" class="list-group-item list-group-item-success">Model,view,controller concept</a> <a href="#" style="cursor:pointer" class="list-group-item list-group-item-info">Action filter</a> <a href="#" style="cursor:pointer" class="list-group-item list-group-item-warning">Routing</a> <a href="#" style="cursor:pointer" class="list-group-item list-group-item-danger">Strating with EF</a> </div>
</div>
</div>
</div>
</body>
</html>