Hey everyone, I'm currently working on a new project for the website and am trying to recreate something similar to this design: view image here
At this point, I have managed to create half of the shape using the following code:
<div id="block"> </div>
#block {
width: 100%;
height: 400px;
background: #ccc;
position: relative;
margin-top: 100px;
}
#block:before {
content: '';
position: absolute;
top: 0;
left: 0;
border-top: 80px solid #fff;
border-right: 80px solid #ccc;
width: 400px;
}
Currently, it looks like this: view image here I would like to know how I can continue drawing the shape by adding another line above and below. Any suggestions? Thank you!