Hintergrund vergrößern

[tzunami]

Hey.

Ich habe ein Problem mit den verschiedenen Auflösungen auf meiner Homepage. Eigentlich habe ich alles für alle Auflösungen optimiert, nur da ist die Sache mit dem Hintergrund:

  
 <span class="sup">Punkt1</span>  
  <div>  
   <ul>  
   <li><a href="?">Punkt1.1</a></li>  
   <li><a href="?">Punkt1.2</a></li>  
   <li><a href="?">Punkt1.3</a></li>  
   </ul>  
  </div>  

====

  
.inhalt .sup{  
 background-image:url(button.gif);  
 background-repeat:no-repeat;  
 text-align:center;  
 text-decoration:none;  
  
 color:#FFFFFF;  
 font-weight:bold;  
  
 display:block;  
 float:left;  
  
 width:150px;  
 padding-top:0.4em;  
 margin-top:0.5em;  
}  

Einem span wird also ein Hintergrundbild zugewiesen, das genau 150px breit ist. Das span fasst also das gesamte Hintergrundbild auf.
Wenn ich jetzt die Auflösung ändere, dann wird das Hintergrundbild natürlich größer und zerstört mein Design.

Gibt es eine Möglichkeit, ein Hintergrundbild mit einer relativen Breite auszustatten? Wenn nicht, gäbe es eine Alternative?

danke euch,
euer tzunami