<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<div role="tabpanel" class=" tab-pane" id="skill" >
<div class="skill-section">
<div class="row">
<div class="col-md-8 col-md-offset-2 col-sm-8 col-sm-offset-2 col-xs-8 col-xs-offset-2">
<div class="progress">
<div class="progress-bar active" role="progressbar" aria-valuenow=" 45" aria-valuemin="0" aria-valuemax="100" style="width: 80%">
<span class="skill-name"><strong>Html5</strong></span>
</div>
</div>
</div>
<div class="col-md-2 col-sm-2 col-xs-2 text-left">80%</div>
</div>
<div class="row">
<div class="col-md-8 col-md-offset-2 col-sm-8 col-sm-offset-2 col-xs-8 col-xs-offset-2">
<div class="progress">
<div class="progress-bar active" role="progressbar" aria-valuenow=" 45" aria-valuemin="0" aria-valuemax="100" style="width: 70%">
<span class="skill-name"><strong>Css3</strong></span>
</div>
</div>
</div>
<div class="col-md-2 col-sm-2 col-xs-2 text-left">70%</div>
</div>
<div class="row">
<div class="col-md-8 col-md-offset-2 col-sm-8 col-sm-offset-2 col-xs-8 col-xs-offset-2">
<div class="progress">
<div class="progress-bar active" role="progressbar" aria-valuenow=" 45" aria-valuemin="0" aria-valuemax="100" style="width: 90%">
<span class="skill-name"><strong>Bootstrap 3</strong></span>
</div>
</div>
</div>
<div class="col-md-2 col-sm-2 col-xs-2 text-left">90%</div>
</div>