Hintergrund einer Webseite

[HanSolo]

Hallo,

hätte eine Frage zu einer Webseite, die ich gerade am erstellen bin. Die Webseite hat als Hintergrund eine rote Fläche mit einem Wabenmuster. Den Hintergrund erreiche ich indem ich eine Grafik (20x134 Pixel) entsprechend kachel. Hab ich im CSS mit dieser Zeile umgesetzt:

  
html {  
	background: url(../images/background.png);  
}  

Hier noch der Link zur Webseite:

Webseite mit Wabenhintergrund

Zukunftig soll der Hintergrund mit dem Wabenmuster nichtmehr überall die gleiche Helligkeit haben. Zur Mitte der Seite soll der Wabenhintergrund etwas dunkler werden. Ausgehend von der Mitte soll er dann wieder etwas heller werden, um schließlich am Ende der Seite wieder zu seiner Ausgangshelligkeit zurückzukehren.

Ich könnte nun natürlich eine Hintergrundgrafik verwenden die entsprechend breit ist. Die Frage ist nur wie breit ich sie mache, ich meine ich weiss ja nicht wie hoch die Auflösung des jeweiligen Nutzer ist und weiss demnach auch nicht wo die Mitte der Seite ist.

Beispiel:

Bei Nutzer 1 mit einer kleinen Auflösung ist die Mitte der Seite bei 500 Pixeln. Demnach muss der Wabenhintergrund bei 500 Pixeln am dunkelsten sein.

Bei Nutzer 2 mit einer großen Auflösung ist die Mitte der Seite bei 700 Pixeln. Demnach muss der Wabenhintergrund bei 700 Pixeln am dunkelsten sein.

Ne Idee wie ich das lösen kann, so das unabhängig von der Auflösung des Nutzers der dunkelste Teil des Hintergrundes immer in der Mitte der Seite ist.