Пробовал через hr, возникли проблемы с позиционированием (внутри угла текст)
2 ответа
Может вариант через before
и after
.item {
padding: 2rem;
position: relative;
margin: 50px;
}
.item::before {
content: "";
position: absolute;
top: 0;
left: -10px;
width: 30%;
height: 1px;
background: red;
}
.item::after {
content: "";
position: absolute;
top: -10px;
left: 0px;
width: 1px;
height: 100%;
background: red;
}
<div class="item">hello</div>
Сколько вариантов..
Подкину ещё вариант на background
.elem {
display: block;
width: 200px;
height: 200px;
background:
linear-gradient(0, #000, #000),
linear-gradient(0, #000, #000);
background-repeat: no-repeat;
background-position: 10% 0, 0 10%;
background-size: 1px 100%, 100% 1px;
}
<div class="elem"></div>
-
1
position