Hintergrund-Vignette: Box-Shadow bei Seiten mit geringer Höhe

  • Hallo,

    ich nutze folgenden Effekt um die Ecken des Hintergrundbilds zu ändern:

    body, .tabularBox, .dialogTitlebar {
    background-image: url("../images/blueTemptation/blueTemptationHeader.png");
    background-repeat: repeat-x;
    box-shadow: 0 0 250px rgba(0, 0, 0, 0.8) inset;
    }

    Bei Seiten mit geringer Höhe endet die Vignette leider unterhalb des Copyrights, z.B. https://www.woltlab.com/index.php/User/

    Wie kann ich bei Seiten, die die Bildschirmhöhe nicht voll ausnutzen die Vignette dennoch über den gesamten Bildschirm darstellen?

    Jemand eine Idee?

    Seewie Signatur

  • So funktioniert es auf kurzen Seiten

    /* HG-Vignette immer bis Seitenende */
    html, body {
    height: 100%;
    }

    Bei Seiten mit Scrollbalken endet die Vignette allerdings dann mitten in der Seite. Kann man abfragen ob die Länge des Inhalts kleiner als der darstellbare Bereich ist und nur in den Fällen den CSS-Code anwenden? Oder gibt es eine bessere Lösung?

    Seewie Signatur

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!