div c классом videoInadvantageLund имеет заданную ширину 565px, по факту в браузере он имеет размер 386,64px. Причем он ведет себя так, только когда является flex элементом. Когда я у родителя убираю display: flex, элемент принимает заданные размеры.
p.s В дублирующем блоке, который находится ниже, вместо div есть img, с ней таких проблем нет, она занимает свой фактический размер.
HTML:
<section class="advantageLund">
<h2>Баланс прочности и надежности</h2>
<div class="contentadvantageLund">
<div class="blockContentAdvantageLund">
<div class="videoInadvantageLund">
</div>
<div class="descriptionAdvantageLund">
<h3>Непревзойденная производительность</h3>
<p>Технология IPS, IPS2, и IPS3 Lund исключительная обеспечивает бесподобный контроль и более ровную, более сухую езду.</p>
<hr>
</div>
</div>
<div class="blockContentAdvantageLund">
<div class="descriptionAdvantageLund">
<h3>Непревзойденная производительность</h3>
<p>Технология IPS, IPS2, и IPS3 Lund исключительная обеспечивает бесподобный контроль и более ровную, более сухую езду.</p>
<hr>
</div>
<img src="image/banners/banner-advantage.jpg" alt="">
</div>
</div>
</section>
CSS:
/* Start advantage Lund */
.advantageLund {
width: 100%;
background-color: #fbfbfd;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
padding: 86px 0 107px 0;
}
.advantageLund > h2 {
color: #333333;
font-family: "Montserrat", sans-serif;
font-size: 48px;
font-weight: 600;
line-height: 36.71px;
text-transform: uppercase;
letter-spacing: 4.8px;
margin-bottom: 87px;
}
.contentadvantageLund {
width: 63vw;
max-width: 1209px;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.blockContentAdvantageLund {
display: flex;
justify-content: space-between;
align-items: center;
}
.blockContentAdvantageLund > img:nth-child(odd) {
margin-right: 113px;
}
.blockContentAdvantageLund > img:nth-child(even) {
margin-left: 113px;
}
.blockContentAdvantageLund:not(:last-child) {
margin-bottom: 53px;
}
.descriptionAdvantageLund > h3 {
color: #96050b;
font-family: "Montserrat", sans-serif;
font-size: 36px;
font-weight: 700;
line-height: 56px;
text-transform: uppercase;
margin-bottom: 14px;
}
.descriptionAdvantageLund > p {
color: #12132a;
font-family: "Montserrat", sans-serif;
font-size: 18px;
font-weight: 600;
line-height: 41px;
margin-bottom: 39px;
}
.descriptionAdvantageLund > hr {
margin: 0;
border: 0;
width: 86%;
height: 8px;
background-color: #96050b;
}
/* End Advantage Lund */
.videoInadvantageLund {
width: 565px;
height: 400px;
background: url(../image/logo/maxresdefault.webp) no-repeat;
background-size: cover;
}