Как правильно задать высоту для absolute елемента?

Question

[Andrew Morozov]

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



Вот мини пример (codepen)

Comments

[alexalexes]

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

[Andrew Morozov]

alexalexes, А если мне нужно это "всплывающее меню" что бы появлялось поверх контент при открытии

Answer 1

[Spaceoddity]

.menu{
  position: static; /* )) */
  transform: translateY(-100vh);
  transition: transform 0.3s;
}
.menu.active{
  transform: translateY(0);
}

Comments

[Andrew Morozov]

Всплывающее окно по дизайну должно быть по верх другого контент, то есть absolute....

[Andrew Morozov]

Я там оставил ссылку на codepen, примерно то в чём проблема

[Spaceoddity]

mark1505, нет.
зачем вы уже второй раз спорите насчёт этого момента, если сами обращаетесь с подобным вопросом и даже не проверили?))
translate - вырывает элемент из потока. он и так будет поверх всех остальных элементов.
вот я вам проиллюстрировал:
https://codepen.io/nanto-work/pen/gOeKYXd

[Andrew Morozov]

Spaceoddity, Как-то всё равно не так получается, паркуется постоянно в разных местах....

[Andrew Morozov]

Spaceoddity, Хотя в codepen работает нормально вроде-бы
-_0

[Andrew Morozov]

Spaceoddity, Если вместо static написать absolute всё нормально...