Как мне сделать эту навигационную панель нужной высоты?

Question

Я пытаюсь заставить это div отображаться как правильное height (без ручной установки height на фиксированное число, такое как 75px).

, чтобы оно выглядит так:

------------------------------------------
| something | something else             |
------------------------------------------

https://jsfiddle.net/2fLr6enx/

Я использую float слева div, так что он всегда будет тянуть влево и иметь левую div и вправо div в одной строке (даже если правое div является очень большим изображением).

Это, однако, может сделать контейнер div меньшим в height, чем слева div (соответствует height контейнера справа div)

Я пытался сделать эту работу с inline-block, table-cell и другими css, однако он не может заставить его работать, когда они оба находятся в одной строке, а height контейнера содержит их обоих.

Как бы мне этого добиться?

Answer 1

Flexbox отлично подходят для такого рода проблем. Просто замените ваш

.container {
   ...
   display: block;
   ...
}

на

.container {
   ...
   display: flex;
   ...
}