Score bar CSS

by andfinally

HTML

<div class="pers-score-container">
    <div class="pers-score bar-1" style="width:30%"></div>
    <div class="pers-score bar-2" style="width:20%"></div>
</div>

CSS

.pers-score-container {
    width: 500px;
    height: 10px;
    border: 1px solid #ddd;
}

.pers-score {
    float: left;
}

.bar-1 {
    border-top: 10px solid darkblue;
}

.bar-2 {
    border-top: 10px solid lightblue;
}
}