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

Question

[Catcop]

Вот код: https://jsfiddle.net/kvofd9eb/2/

1) Я сымитировал ситуацию, когда открыты субменю, и конкретно в последнем таком субменю есть 4 пункта, из-за этого высота документа получилась выше, чем 100vh заданный самому сайтбару. Таким образом получается что сайтбар растянулся не на всю высоту и имеется зазор. Как можно исправить ситуацию средствами css?


2) Приемлемо ли вообще таким образом верстать субменю и в принципе, как бы вы оценили верстку и есть ли более лучшие варианты для данной реализации?

Answer 1

[Dmitriy Grape]

Не имеет смысла пытаться сделать это 100vh, всё-равно найдётся экран, на котором это будет смотреться по-уродски. Даже если попытаться впихнуть это всё в 100% пространства экрана, скорее всего, оно просто съедет из-за недостатка места.

Comments

[Catcop]

1) Не совсем понял, почему не 100vh ? Что значит найдётся экран, на котором это будет смотреться по-уродски? Считаете, что не нужно растягивать сайтбар на всю высоту??

2) Так какие варианты можно тогда придумать?
Вот дал дизайнер, такой макет и какой выход можно найти?

Answer 2

[Александр Осадчий]

Но здесь нужно продумать логику выпадающих списков - проблема же в том, что список получается ниже основного меню..оно и дает пустую область

Comments

[Catcop]

Что-то не совсем понял стратегии?
В смысле пространство-то больше нет, но и пункты меню пропали

[Александр Осадчий]

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

В данном случае лучше сделать разворачивающееся меню..аккордеон