Как сделать границу меньше контента?

Question

[War4]

Есть никая страница. В самом верху,а заголовок под ней черта(border). По макету ширина черты должна составлять ровно 88px, он она растянута на всю страницу. Я пытался это исправить через border-bottom-width, но почему то он черта становится жирнее(в длину) а ширина черты остается на всю ширину экрана.
https://codepen.io/dusiv_2004/pen/ZEoKbjP

Answer 1

[Ankhena]

Я пытался это исправить через border-bottom-width

border-bottom-width отвечает за толщину границы.

А вам нужно убрать border вовсе.
А полоску сделать псевдоэлементом.

Как-то так
https://codepen.io/AnnaSummer/pen/KKRmVwE

Answer 2

[ThunderCat]

Я пытался это исправить через border-bottom-width

Документация для слабаков, да...
Спойлер - "ширина" бордера справа-слева-сверху-снизу отражает толщину линии, а не протяженность по стороне.

Самое простое решение - убрать бордер снизу, положить див в нужное количество пикселей высотой с нужной заливкой и шириной и дать маржин авто.