Как мне изменить цвет фона обтравочного контура - PullRequest
1 голос
/ 21 марта 2019

Я хочу обернуть мой 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>

Вот так я хочу, чтобы это выглядело enter image description here

...