Есть два блока, в обоих таходится текст, и соединяються они стрелкой (смотреть на фото). Внимание знатоки, как сделать максимально похожую перемычку?
Спасибо!
Stack Overflow на русском — это сайт вопросов и ответов для программистов. Присоединяйтесь! Регистрация займёт не больше минуты.
Присоединиться к сообществуПримерно так:
.test {
display: inline-block;
width: 100px;
height: 30px;
background-color: purple;
border: 1px solid white;
border-radius: 5px;
position: relative;
}
.test:before {
content: '';
position: absolute;
width: 30px;
height: 30px;
border: 5px solid white;
border-left: none;
border-bottom: none;
border-radius: 5px;
top: -2px;
left: calc(50% - 30px);
transform: rotate(45deg);
}
<div class="test"></div>