Мобильная версия
Можно ли сделать границу div скрытой конкретное место, как на картинке выше?
Какой-то div маскирует другой div без установки цвета фона (поскольку фон всего сайта представляет собой градиент).
Я не хочу использовать SVG, потому что хочу, чтобы свойства границ были доступны для использования.
Я пытался использовать псевдоэлементы с свойство маски с черным прямоугольником SVG внутри него, но граница все еще видна (даже если я поместил маску внутри элемента div .card без ::after.
.card {
position: relative;
display: flex;
flex-direction: column;
height: 100%;
width: 100%;
padding: 2rem;
border: 1px solid var(--border-color);
border-radius: 2vw;
}
.card::after {
content: "";
position: absolute;
width: 50px;
height: 10px;
top: -5px;
left: 50%;
transform: translateX(-50%);
-webkit-mask: url("../../assets/rect-mask.svg");
mask: url("../../assets/rect-mask.svg");
}
Подробнее здесь: https://stackoverflow.com/questions/786 ... f-a-border
