Как продлить по высоте второй блок?

Question

[keche]

Как продлить по высоте второй блок (с меню), чтобы он занимал всю высоту второго блока с контентом?

Answer 1

[mr_dev1l]

через flex

Comments

[keche]

Через flex не подходит.

[mr_dev1l]

есть еще варианты, можно на jQuery сделать, можно через position: absolute, но это костыли, за которые ругаются)

[keche]

mr_dev1l, а какой есть кастыль с absolute?

[mr_dev1l]

Все обернуть в div, у которого будет position:relative и height: auto. Далее контентная часть будет этот div растягивать по высоте, а правому блоку position: absolute;right:0;height:100%; Но не забывайте, если у вас фиксированные размеры, то блоку с контентом нужно будет задать padding-right на ширину правого блока

[keche]

mr_dev1l, спасибо, работает.

Answer 2

[aloky]

.menu { height: 100vh; }
И было бы легче вам помочь, если вы предоставили код.
И пример тут на глазах у тебя даже dl4.joxi.net/drive/2018/02/16/0022/1330/1500466/66...

Comments

[keche]

При использовании height: 100vh; не тянеться до конца все равно блок с меню.

[aloky]

keche, Дайте код, чтоб мы помогли.

[keche]

aloky, https://jsfiddle.net/sdtL5sex/5/, желтый блок с надписью должен тянуться вниз соотвественно.

[mr_dev1l]

keche,

.container {
  width: 70%;
  background: red;
  position:relative;
}
.content {
  width: 70%;
  background: gray;
}
.menu, .content {
  display: inline-block;
  vertical-align: top;
}
.menu {
  width: 29%;
  background: yellow;
  height: 100%;
  position: absolute;
  height: 100%;
  right:0;
  top:0;
}

[keche]

mr_dev1l, спасибо, работает.

Answer 3

[maxsnw]

дай через жквери ему высоту
$(document).ready(function () {
var content_height = $('.content).outerWidth();
$('.menu').css('height', content_height);
});

Answer 4

[Сергей delphinpro]

Ввиду того, что не озвучены подробные условия, смею предположить что подойдёт старая добрая имитация https://jsfiddle.net/f5yxror3/

Answer 5

[tyzberd]

если еще такой вариант https://jsfiddle.net/sdtL5sex/14/