css - 境界線の右側の長さを短くします

Question

私には国境があります：

.verticalLineTop {
    border-top:solid #6E6A6B;
    border-width:1px;
    width: 130px;
}

境界線の右側の一部をトリミングするために幅をハードコーディングしていますが、これはcssを使用して実行できますか？

だから：の代わりに

________________________

これが表示されます：

____________________

Answer 1

部分的なCSS border-top、そのすべてまたは何も設定することはできません。

常に上部の境界線を幅の特定のパーセンテージにしたい場合は、パーセンテージの幅で要素をネストできます。

.verticalLineTop
{
    width:80%;
    border-top:solid 1px #000;
}

ライブデモ： http： //jsfiddle.net/P3RKB/1

Answer 2

.verticalLineTop:before
 {
   width:80%;
   border-top:solid 1px #000;
   content: "";
   display: block;
   padding-top: 10px;
 }