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. http://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?

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?

dank Dir @Miracoolix , führt jedoch zum gleichen Problem, z.B.
...index.php/BoardQuickSearch/?mode=unreadPosts

die Vignette endet bereits vor dem Fenster Ende

aber so funktioniert es tatsächlich:

html {
box-shadow: 0 0 250px rgba(0, 0, 0, 0.8) inset;
min-height: 100%;
}

Für alle User, die eine CSS-Vignette über den HG legen wollen
Dank Dir Miracoolix