правильно ли указан код. внизу результат этого кода, а сверху как он должен выглядит. мне кажется такой способ усложняет показ страницы. пхж слишком затруднил. может есть простой код который выдасть такой же результат. а еще насколько правильно указать длину процентом
<div class="review-container">
<div class="gorizontal-box"></div>
<div class="text-review">
<p style="font-size: 16px">Guest Reviews</p>
<p style="font-size: 16px">"AENEAN SOLLICITUDIN, LOREM QUIS BIBENDUM AUCTOR, NISI ELIT CONSEQUAT IPSUM, NEC SAGITTIS SEM NIBH ID ELIT. DUIS SED ODIO SIT AMET NIBH VULPUTATE CURSUS A SIT AMET MAURIS. MORBI ACCUMSAN IPSUM</p>
<p style="font-size: 16px">Lesley Greenman, Australia</p>
</div>
<div class="vertical-box"></div>
</div>
.review-container {
width: 100%;
height: 500px;
margin-top: 40px;
background-color: aqua;
display: flex; /* Используем flexbox для выравнивания дочерних элементов */
position: relative; /* Добавим позиционирование для корректного расположения внутренних элементов */
}
.text-review {
height: 100%;
width: 30%;
background-color: yellow;
overflow: hidden;
padding: 20px 50px;
box-sizing: border-box;
}
.gorizontal-box {
height: 100%;
width: 50%;
background-color: red;
background-image: url('../assets/picone.jpg');
background-size: cover;
}
.vertical-box {
height: 100%;
width: 20%;
background-color: chartreuse;
background-image: url('../assets/pictwo1.jpg');
background-size: cover;
}
@media (max-width: 768px) {
.text-review, .gorizontal-box, .vertical-box {
width: 100%;
}
}