0

Как сделать так, чтобы блок1 изменял высоту до размеров блока2? (зависил от блока2)

article > #content > .layout-news {
 display: flex;
 width: 80%;
 height: auto;
 border-radius: 20px;
 margin: auto;
 overflow: hidden;
 position: relative;
 padding: 10px;

 border: solid 3px red;
}

article > #content > .layout-news > .layout-news_banner {
 border-radius: 20px;
 overflow: hidden;
 width: 600px;
 height: auto;
 background: rgb(238, 238, 238);
 margin: auto 1%;
 padding-bottom: 30px;

 border: solid 3px red;
}
<div class="layout-news layout-news_style-text">
        <aside class="layout-news_banner">
            <img src="img/layout-news_1.jpg">
            <h2>Котя уснул, выполняя ДЗ</h2>
            <p>"Здоровый сон важнее", - говорит котя</p>
        </aside>
        <aside class="layout-news_banner">
            <img src="img/layout-news_2.jpg">
            <h2>Кот зол, потому что вода</h2>
            <p>Он намочил лапки и готов разорвать ими всех вокруг!
                <br> Даже не понятно, почему <br> и главное как
            </p>
        </aside>
    </div>

Блоки

1 ответ 1

0

Можно делать таблицу...

<table><tr>
  <td class="layout-news_banner">сюда первую картинку</td>
  <td class="layout-news_banner">Сюда вторую</td>
</tr></table>

Её блоки всегда автоматически принимают одинаковый размер.
И прикрутить к ним vertical-align: top; background-color: rgb(238, 238, 238);

С таблицами - железобетонно, всегда и везде. Но скорее всего тут и просто добавление height: 100% прокатило бы, вместо auto

1
  • Зависить стал, но теперь при маленьком сужении окна - верстка изображения начинает плыть - картина1, где 1 строка, выше картины2, где 3 строки
    – Vadim Kain
    28 фев 2019 в 21:21

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.