Никак не могу выровнять два элемента с инлайн-блок. Должны идти в ряд с одинаковой высотой. Идут в ряд, но первый элемент ниже, второй выше. Подскажите, пожалуйста, в чем ошибка.
.support {
font-size: 0px;
padding: 0;
line-height: 25px;
}
.support-text p {
display: inline-block;
font-size: 25px;
margin-top: 17px;
}
.support-text {
display: inline-block;
width: 500px;
height: 110px;
text-align: center;
font-weight: 500;
background: #ccc;
}
.support-logo {
display: inline-block;
width: 200px;
height: 110px;
background: #F7F7F7;
}
.support-line {
width: 100%;
height: 7px;
background: rgb(0, 12, 48);
}
<section id="support" class="support">
<div class="support-text">
<p>ПРИ ПОДДЕРЖКЕ МЕЖДУНАРОДНОЙ<br> ОБРАЗОВАТЕЛЬНОЙ КОМПАНИИ<br> и Т.Д.</p>
</div>
<div class="support-logo"></div>
<div class="support-line"></div>
</section>
support
display: flex;
С этим inline-block намучаетесь...vertical-align:top;
к классу.support-text
или к.support-logo