Hintergrundbild nicht zu sehen

[Manni]

Hallo,

ich bin gerade wieder am verzweifeln.
Ich lasse mit CSS beim Hover über einen Link das Hintergrundbild wechseln.
Das habe ich schon oft gemacht und es hat immer funktioniert.
Allerdings mache ich gerade eine neue Seite und dort erscheint das Hintergrundbild nicht.
Irgendwo ist ein Fehler und ich finde ihn nicht.

Relevanter CSS-Teil:

div#links{width:500px;  height:50px;  background:url(hg.gif) no-repeat;  margin-left:1px;}  
ul#nav{text-align:center; padding-top:10px;margin:0;list-style:none;}  
ul#nav a{outline-style:none;}  
ul#nav a span{display:none;}  
ul#nav li{display:inline;}  
a#link1{width:50px;  height:30px;  background:url(link1.gif) no-repeat;}  
a#link1:hover,a#link1:active{background:url(link1_hover.gif);}

HTML:

<div id="links">  
<ul id="nav">  
<li><a href="/1" id="link1"><span>Link 1</span></a></li>  
<li><a href="/2" id="link2"><span>Link 2</span></a></li>  
<li><a href="/3" id="link3"><span>Link 3</span></a></li>  
<li><a href="/4" id="link4"><span>Link 4</span></a></li>  
</ul>  
</div>

Der Fehler muss in den geposteten Teilen liegen, da ich alle anderen Teil schon weggelassen habe und das Bild immer noch nicht zu sehen war. Die Pfade zu den Bilder stimmen auch alle.
Findet ihn jemand?

[Ingo Turski]

Hi,

ul#nav a span{display:none;}
ul#nav li{display:inline;}
a#link1{width:50px;  height:30px;  background:url(link1.gif) no-repeat;}

Dir ist nicht bewußt, dass inline-Elementen weder Breite noch Höhe zugewiesen werden können (von fehlerhaften Browserimplementationen abgesehen). Und Da Du den Inhalt ausblendest, nehmen die Links auch keinen Raum ein.

freundliche Grüße
Ingo

[Manni]

Dir ist nicht bewußt, dass inline-Elementen weder Breite noch Höhe zugewiesen werden können (von fehlerhaften Browserimplementationen abgesehen). Und Da Du den Inhalt ausblendest, nehmen die Links auch keinen Raum ein.

Entschuldigung, aber das habe ich nicht ganz verstanden.
Wenn ich die Größenangaben aus dem Inline-Element rausnehme und z.b. bei ul#nav angebe, erscheint auch nichts.
Wo muss das denn dann rein?

[Ingo Turski]

Hi,

Wenn ich die Größenangaben aus dem Inline-Element rausnehme und z.b. bei ul#nav angebe, erscheint auch nichts.

Logisch - weil das keine Auswirkung auf die Links und deren hintergrund hat.

Wo muss das denn dann rein?

Falsche Frage. Wenn die Links Höhe und Breite bekommen sollen, dann brauchen sie entweder einen entsprechend großen Inhalt oder sie dürfen nicht inline dargestellt werden.

freundliche Grüße
Ingo

[Manni]

Alles klar. Das werde ich morgen mal ausprobieren.
Ich danke dir sehr.