Я хочу обернуть мой div с обрезанным путем во флоте.
Вот мой HTML и CSS
.clipboard { position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; background-image: url(https://assets.nationbuilder.com/wave/pages/9/attachments/original/1552266959/blueGradientBG.jpeg); background-size: cover; background-position: center center; } .topArea { clip-path: polygon(0px 0px, 900px 0px, 900px 600px, 450px 750px, 0px 600px); width: 900px; margin: auto; display: flex; justify-content: flex-start; align-items: center; flex-direction: column; overflow: hidden; } .navywrapper { width: 900px; height: 100%; margin: auto; background-color: navy }
<div class="navywrapper"> <div class="clipboard topArea"> <img src="https://via.placeholder.com/300x85" class="eventImgInfo"> <img src="https://via.placeholder.com/300x85" class="eventImgInfo"> <img src="https://via.placeholder.com/300x85" class="eventImgInfo"> <img src="https://via.placeholder.com/300x85" class="eventImgInfo"> <img src="https://via.placeholder.com/300x85" class="eventImgInfo"> <img src="https://via.placeholder.com/300x85" class="eventImgInfo"> </div> </div>
Вот так я хочу, чтобы это выглядело