DEV Community

Cover image for Mobile Phones 100vh issue
Tobias Röder
Tobias Röder

Posted on

Mobile Phones 100vh issue

In diesem Blog wird kurz erklärt, wie man auf dem Smartphone das 100vh Problem lösen kann.

In diesem Codepen Beispiel ist ein Lösungsweg, wie man die '100vh' Höhe in einem mobile Browser mit CSS einstellt.

Kurz erklärt: das am übergeordnetste div Element, in diesem Beispiel #app, wird mit der Hilfe von position: absolute und top: 0; right: 0; bottom: 0; left: 0; auf die komplette Größe in der Breite als auch in der Höhe der Browsers gesetzt. Das ist wie die Höhe auf 100% zu setzten.

Top comments (0)