Как сделать что бы линия не растягивалась во всю ширину?

Question

[Игорь Луговской]

Вставляю svg в background и оно растягивается во всю ширину блока.
Должна быть полоска по центру блока в 5 пикс в ширину и 100% в высоту

background: url('/img/svg/line.svg'), top center / 5px 100% no-repeat;

Answer 1

[Antony Bark]

решение в лоб https://codepen.io/tolfy/pen/abEYyxE

:root {
    --svg-width: 5px;
}
.parent {
    position: relative;
    z-index: 1;
}
.parent:before {
    content: '';
    position: absolute;
    z-index: 2;
    width: 5px; /* можно задать через переменную var(--svg-width) */ 
    height: 100%;
    margin-left: calc(50% - var(--svg-width) / 2);
    display: block;
    background: red; /* подставьте своё, позиционировать не надо */ 
}