Как сделать "выгиб внутрь" линий вот такой для блочного элемента (как на скриншоте ниже)?
С помощью iframe#video { transform: skew(5deg); } можно сделать наклон, но вот выгнуть линии как так можно? Есть идеи?
В инете нашел только дико костыльный способ путём добавления перекрывающих div с каждой из 4-х сторон (ну должно же, елки-палки, быть более элегантное решение), вот перекрытие с одной стороны:
<div class="parent">
<div class="block">
</div>
</div>
.parent{
position:relative;
margin:0 auto;
width:400px;
height:200px;
background:rgb(20, 31, 41);
overflow:hidden;
}
.block{
text-align:center;
position:absolute;
width:102%;
height:40px;
background:white;
bottom:-18px;
left:-1%;
border-radius:50%;
}