Bootstrap progressbar vertical

Bootstrap progressbar vertical

HTML

<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<script src="http://code.jquery.com/jquery.min.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
 <div class="progress vertical">
  <div class="progress-bar progress-bar" style="height: 70%;width:100%"></div>
  </div>
  <div class="progress vertical">
  <div class="progress-bar progress-bar" style="height: 20%;width:100%"></div>
  </div>
  <div class="progress vertical">
  <div class="progress-bar progress-bar" style="height: 10%;width:100%"></div>
</div>

CSS

.progress.vertical {
    position: relative;
    width: 20px;
    min-height: 240px;
    float: left;
    display: flex;
  align-items: flex-end;
    background: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    border: none;
}