Если div больше высоты экрана то применить .css2?

Question

[Za Za]

подскажите как реализовать сабж.
Магаз на вукомерц
нужно чтоб если контен помещается во весь экран то он был четко по середине страницы:

position: absolute;
        top: 50%;
        left: 50%;
        margin-right: -50%;
        transform: translate(-50%, -50%)

если же контент длиннее экрана то стандартно
position: relative;

медиазапросами это не добиться (там зависит не от контента)

Comments

[Степан Крапивин]

Опиши задачу в общем. Что именно ты пытаешься сделать этими костылями?

[Za Za]

открывается страница и в ней инфа уходит в низ за пределы экрана (=> 100vh) - тогда применяются стили style1.css
если при открытии страницы контент не уходит за пределы экрана ( < 100vh) - тогда применяются (или добавляются дополнительные) стили style2.css

При заполнении полей оформлении товара есть страницы с кучами полями которые нужно заполнять/скролить до кнопки далее... но есть и такие где всего два поля (способы оплаты) и тогда они располагаются в самом верху страницы а остальная часть воздух - визуально это не красиво и хотелось бы при таком раскладе центрировать это по центру страницы (чтоб воздух был не снизу, а во круг.

Answer 1

[Иван Шульга]

Попробуй для внешнего контейнера прописать:

{
width: 100vw;
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
}

а для самого элемента position: relative, ширину, высоту и тд (без внешних отступов)

Comments

[Za Za]

пробую - но пока в одном окне получается следом все к черту летит

[Za Za]

в общем при

height: auto; - если контент меньше высоты окна - то все норм
если больше - то все херится

height зависит от контента у меня

[Иван Шульга]

Не смогу что-то дельное сказать, уж прости)