Как можно реализовать нечто подобное? Мне нужно чтобы было 2 блока в ряд, в 1-ом - картинка, во 2-ом - текст (но по центру, как на картинке). И эти 2 блока должны быть на всю ширину страницы.
Я сделал как в предложенном ответе, но все равно остались поля по бокам. Я использую bootstrap, может дело в нем?
.container {
display: flex;
flex-grow: 2;
}
.block__img,
.block__text {
display: flex;
justify-content: flex-start;
align-items: center;
flex-grow: 1;
height: 350px;
padding: 10px;
}
.block__img {
background: url("https://static.tildacdn.com/tild3366-6164-4161-b235-613035623266/infineon_webinar_coo.png") center center;
background-size: cover;
}
.block__text {
background-color: #d2d2d2;
}
<div class="container">
<div class="block__img"></div>
<div class="block__text">
<main>
<h4>Основные сведения о полевых транзисторах<br></h4>
<p>1. Классификация полевых транзисторов<br>2. МОП транзисторы<br></p>
</main>
</div>
</div>