Boxen anzeigen beim Hovern über Images

html.de-Forum HTML, XHTML & CSS
1

Hallo Gemeinde,
ich habe ein völlig simples Problem an dem ich gerade scheitere.
Beim hovern über mehrere Images soll der jeweilige Text in einer Box gezeigt werden.
Ansonsten soll ein Standardtext dargestellt werden.
Ich hab hier mal den stark vereinfachten Code eingestellt:

[CODE]

.imageklein1 { float: left; } .imageklein2 { float: right; }

.txt0 {
width: 80%;
float: left;
border: 1px solid black;
}
.txt1 {
width: 80%;
float: left;
border: 1px solid green;
}
.txt2 {
width: 80%;
float: left;
border: 1px solid red;
}

Banner
Banner

Standard Beiträge Schwarz

Grüne Beiträge Google

Rote Beiträge ARD

[/CODE]

Wer kann weiter helfen?

2

Dein Aufbau ist ziemlicher Schrott, Klassen verwendet man so nicht.
Abgesehen davon würde das so funktionieren:

[CODE].txt1,
.txt2 {
display:none;
}

.imageklein1:hover ~ .txt1 {
display:block;
}

.imageklein2:hover ~ .txt2 {
display:block;
}

.imageklein1:hover ~ .txt0,
.imageklein2:hover ~ .txt0 {
display:none;
}[/CODE]

3

Saugut! Funktioniert! Das ist aus einem größeren Projeht ausgeschnitten und stark vereinfacht.
Danke!