CSS:
.authors {
background-color: cadetblue;
height: 600px;
justify-content: space-between;
}
.plate {
background-image: url(../images/plate.png);
background-repeat: no-repeat;
align-items: center;
justify-content: center;
margin-top: 86px;
height: 540px;
margin-left: 157px;
margin-right: 1100px;
}
.plate h2 {
padding-top: 160px;
margin-left: 240px;
font-size: 34px;
font-family: 'Josefin Sans Light', arial;
}
.plate a {
color: #a9a9a9;
margin-top: 10px;
margin-left: 220px;
display: block;
line-break: auto;
}
.karen {
background-image: url(../images/karen.png);
background-repeat: no-repeat;
align-items: center;
justify-content: center;
margin-top: 86px;
height: 540px;
margin-left: 1100px;
margin-right: 157px;
box-shadow: 0px 0px 10px 0.3px grey;
background-color: #fff;
}
.fail {
padding-top: 20px;
margin-right: 165px;
margin-left: 50.5px;
}
.fail_text {
font-size: 18px;
}
.plate_button {
margin-top: 125px;
margin-left: 210px;
}
HTML:
<div class="authors">
<div class="plate">
<div class="fail">
<a class="fail_text">404</a>
<hr>
</div>
<h2>Sorry</h2>
<a>WE COULDN’T<br>FIND THE PAGE<br>:(</a>
<button class="plate_button">
BACK
</button>
</div>
<div class="karen">
<a>Привет</a>
</div>
</div>
Нужно, чтобы второй блок был на ровне с первым, а получается вот так