macmensa: Bei hover eine Klasse ansprechen

Hi @all...

Bitte nicht gleich schlagen für meine für die Experten etwas laienhaft oder stümperhaft anmutenden Versuche... Aber ich habe hier eine Aufgabenstellung die mich zum verzweifeln bringt.

Hier eine Testseite mit meiner Aufgabenstellung: TestSeite

Es geht dabei um den Inhalt der innerhalb des Hintergrundbildes liegt. Das ist eine etwas abstrakte Darstellung dessen was es später mal machen soll... Grundsätzlich will ich die Infotexte später ein und ausblenden mit display... Für die Problemstellung will ich jedoch erstmal nur die Farbe ändern. (Oben bei den 5 kleinen Bildern funktioniert das Prinzip ähnlich, da konnte ich jedoch mit Bildern arbeiten und dem beinhaltenden a, darum soll es hier also nicht gehen)

Folgender CSS Code steht dem ganzen zu Grunde:

  
#info {  
position: relative;  
display: block;  
top: 0px;  
left: 0px;  
width: 785px;  
height: 840px;  
background: #777777  
}  
  
#info span {  
position: relative;  
display: block;  
text-decoration: none;  
}  
  
#info span.inhalt {  
position: absolute;  
width: 200px;  
left: 270px;  
top: 180px;  
font: 14px arial, sans-serif;  
font-weight: bold;  
text-align: center;  
text-decoration: none;  
display: block;  
}  
  
#info span:hover span.inhalt {  
color: #777777;  
}

Und für den ersten Link folgender HTML Code:

<span class="inhalt">Die ist ein Infotext zu Link1 </span>  
  
<p><b><a href="http://www.google.de" target="_blank"><span style="font-size: 20px;">Ein Link zu Google</span></a></b></p>

Ich schaffe es einfach nicht in verschiedensten ausprobierten Kombinationen bei hover auf das "span" innerhalb des Links die Unterklasse "inhalt" anzusprechen, also den Infotext. Und langsam drehe ich mich innerlich im Kreis und sehe eventuell den Wald vor lauter Bäumen nicht mehr... Auch über das "a" die Unterklasse des span anzusprechen führte bisher zu keinem Erfolg...

Wie gesagt, absoluter Anfänger in Sachen CSS... Daher fehlt mir eventuell gerade etwas das richtige Verständniss für mein Problem...

Ich hoffe auf konstruktive Hilfe... Danke im vorraus... Mac

  1. <span class="inhalt">Die ist ein Infotext zu Link1 </span>

    <p><b><a href="http://www.google.de" target="_blank"><span style="font-size: 20px;">Ein Link zu Google</span></a></b></p>

    
    >   
    > Ich schaffe es einfach nicht in verschiedensten ausprobierten Kombinationen bei hover auf das "span" innerhalb des Links die Unterklasse "inhalt" anzusprechen, also den Infotext.  
      
    Du kannst per CSS keine Elemente außerhalb des betreffenden Zweiges ansprechen. Verwende Javascript oder lege den Infotext in den <p>-Absatz, in etwa so:  
      
    <p>  
      <a>blafasel</a>  
      <span>Info</span>  
    </p>  
      
    p span { display:none }  
    p:hover span { display:block }  
      
      
    Davon unabhängig:  
    - <b> ist bäh.  
    - <span> ist auch bäh, wenn es das einzige Element innerhalb eines anderen Elementes ist, weil man genauso gut das andere Element formatieren kann (Ausnahme: Text durch Textgrafik ersetzen).