Как растянуть блок по высоте?

Question

[Анатолий Родин]

Как растянуть блок .aside-right на всю высоту родителя?

HTML

<div class="container">
  <div class="center">

    <div class="content">
      <!-- Тут расположен контент - размер всегда разный -->
    </div>

    <aside class="aside-right">
      Блок с новостями
    </aside>

  </div>
</div>

CSS

.content-container {
  position: relative;
  width: 100%;
}
  .center {
    position: relative;
    min-width: 32rem;
    max-width: 100rem;
    margin-left: auto;
    margin-right: auto;
  }
   .content {
      position: relative;
      display: inline-block;
      width: 75%;
   }
   .aside-right {
     width: 23rem;
     float: right;
  }

Был вариант с position: absolute, но если в блоке .content мало содержания, то .aside-right залазиет на footer.
Буду рад услышать возможные варианты решения.

P.S.: проблема решена. Необходимо добавить родителю:
display: flex;
flex-wrap: wrap;
Результат: codepen.io/anatolyrodin/pen/MyVebr

Answer 1

[Михаил Чирский]

Набросал на скорую руку, что у вас конкретно не получается?
https://jsfiddle.net/ezaL2chp/

Comments

[Анатолий Родин]

Михаил Чирский в вашем случае есть высота.
В моем случае, она динамична.
codepen.io/anatolyrodin/pen/MyVebr уберите у .content высоту и увидите саму проблему.

[Михаил Чирский]

Анатолий Родин: Я привел пример, в данном случае я задал родителю высоту, вам ничего не мешает сделать ее на 100 %, примеров в сети куча

[Анатолий Родин]

Михаил Чирский спасибо, что откликнулись.
Проблема решена с помощью display: flex.

[Михаил Чирский]

Анатолий Родин: хорошее решение, очень радует, что Flexbox начинают активно использовать)

[Михаил Чирский]

Может, я что то не так понял, ну вот открыл ваш пример, перенес в fiddle, не нашел Flex, а работает как вам нужно
https://jsfiddle.net/2h1L6uqL/

P.S. Могу ошибатся, ну не вижу здесь flexbox

[Анатолий Родин]

Михаил Чирский: виноват, забыл сохранить пен :)
Если интересно, то можете еще раз посмотреть мое решение.

[Михаил Чирский]

Анатолий Родин: Посмотрел, flex-wrap в данном случае не нужен, он не играет никакой роли у вас) ему обычно используют, когда нужно, чтобы блоки которые не влезают, переносили на новую строчку, в вашем случае 30% и 70 % никогда не отработает flex-wrap

[Анатолий Родин]

Михаил Чирский: согласен, это свойсво нужно для многострочной расстановки блоков

Answer 2

[Денис]

что на счет height: 100%; ?

Comments

[Анатолий Родин]

Денис не прокатило. Как ни крутил, а помог только flexbox. На результат можно посмотреть в конце самого вопроса.