1. Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!
    Information ausblenden

Frage Height, wie wird die hier berechnet?

Dieses Thema im Forum "HTML, XHTML & CSS" wurde erstellt von admin, 26 Dezember 2016.

  1. admin

    admin Administrator Team Moderator

    Registriert seit:
    3 August 2009
    Beiträge:
    521
    Punkte für Erfolge:
    28
    Ladies, Gentlemen,

    ich interessiere mich gerade für ein bestimmtes Template welches auf einer normalen Desktop-Seite echt schön ausschaut. Betrachtet man die gleiche Seite auf einem Mobile Device rutscht der gesamte Content nach unten uns es gibt eine Menge unbenutzten Space am oberen Rand des Viewports.

    Hier ist die Seite:
    http://demos.creative-tim.com/material-kit-pro/examples/product-page.html

    Das DIV mit der Klasse "page-header header-filter" zeigt bei mir in Chrome eine Computed Height von 1014 Punkten an. Aber wie kommt Chrome darauf? Die Größe ist eigentlich als 60% Viewport definiert. Und auch wenn ich diese 60vH runternehme auf 30vH bleibt der Whitespace oben bestehen.

    Jemand eine Idee?

    Beste Grüße,


    Carsten
     
    Werbung:

    Jetzt registrieren, damit diese Werbung verschwindet
  2. MrMurphy

    MrMurphy Senior HTML'ler

    Registriert seit:
    28 Juli 2009
    Beiträge:
    1.371
    Punkte für Erfolge:
    63
    Hallo

    Ja.

    Es gibt eine Media Query mit max-width: 991px in der material-kit.css, etwa Zeile 6458 (jeder Browser und Editor zählt die Leerzeilen etwas anders).

    Dort wird für .page-header eine min-height von 100vh bestimmt, die offensichtlich die height-Angabe von 60vh überstimmt.

    Gruss

    MrMurphy