mehrere <DIV> Tags in <A> gültig?

[don soletti]

Hi,

Quelltext, die langen onMouseOver hab ich rausgestrichen, die sind zum ändern der Bildchen.

<a href="../news/index" class="HeadLink" onMouseOver="..." onMouseOut="...">
 <div class='HeadIcon' style='left:50px;'>
  <img src='../pics/head/Head_Pic1_Light.jpg' name='Bild_Head1' alt='Aktuelles' border='0'>
 </div>
 <div class='HeadIcon_Text' style='left:50px;'>
  Aktuelles
 </div>
</a>

Dieser Quelltext zeigt mit CSS ein Bild über einem Text, beides soll als Hyperlink funktionieren.
Beim Firefox funktioniert dies auch einwandfrei, bei IE nimmt er aber leider nur den Text im 2. <DIV> Tag als Link.
So nebenbei: Im Firefox funktionieren auch die CSS :visited, :hover etc, bei IE aber nicht mehr...

Unter der URL  http://www.bmvmaeder.at hab ichs (viel viel umständlicher) gelöst, dies aber nur "temporär". Zumindest so sollte es aussehen.

Hat irgend jemand eine Ahnung ob IE diese Verschachtelung zulässt. Und wenn nicht, warum der Text aber trotzdem als Hyperlink funktioniert?

Wäre dankbar über jede Hilfe oder Anregung, es ist zum Haare raufen...

[Alexander Brock]

Hallo don,

<a href="../news/index" class="HeadLink" onMouseOver="..." onMouseOut="...">
<div class='HeadIcon' style='left:50px;'>
  <img src='../pics/head/Head_Pic1_Light.jpg' name='Bild_Head1' alt='Aktuelles' border='0'>
</div>
<div class='HeadIcon_Text' style='left:50px;'>
  Aktuelles
</div>
</a>

a ist ein Inline-Element, div ein Blockelement => div darf nicht in a stehen.
Verwende stattdessen span und mach das zum Blockelement (display:block;)

Gruß
Alexander Brock

[don soletti]

Danke an Wahsaga und Alexander,

die <div> hab ich bis jetzt verwendet um die Bilder und den darunter stehenden Text zu zentrieren.
Das DIV für den Text ist als einziges "wichtig" da ich dieses auch als background-color:#999999 verwende (aktive Links).

Jetzt weiss ich also wenigstens warum es nicht geht.
Das heisst für mich: nochmal ransetzten.

Ziel: MouseOver für Bilder, der darunter stehende Text soll sich dadurch auch ändern (Daher beides in einem <A>) Auch beim überfahren des Textes soll sich das Bild ändern.
Ich wollte JavaScript so weit als möglich vermeiden (geht eh nicht ganz wegen den Bildern)

Vermutlich gehe ich das ganze zu kompliziert an.

Eine Frage noch:  "Kein <DIV> in Inlines wie <A>..." also wäre umgekehrt richtig? <div><a>...</a></div>

[mapo]

Ziel: MouseOver für Bilder, der darunter stehende Text soll sich dadurch auch ändern (Daher beides in einem <A>) Auch beim überfahren des Textes soll sich das Bild ändern.
Ich wollte JavaScript so weit als möglich vermeiden (geht eh nicht ganz wegen den Bildern)

Hallo,
sieh Dir mal dieses Beispiel an. Sollte Dir helfen....

http://www.css-technik.de/css-examples/160_9/bildermenu.html

Gruß
Manfred

[donsoletti]

http://www.css-technik.de/css-examples/160_9/bildermenu.html

Gruß
Manfred

Die Seite ist spitze!
Danke allen für die Hilfe

[Alexander Brock]

Hallo don,

Eine Frage noch:  "Kein <DIV> in Inlines wie <A>..." also wäre umgekehrt richtig? <div><a>...</a></div>

Ja[tm].

Gruß
Alexander Brock

[wahsaga]

hi,

Hat irgend jemand eine Ahnung ob IE diese Verschachtelung zulässt.

HTML lässt sie nicht zu.
und nein, ob ein div oder fünfhundert, ist vollkommen egal - div ist ein block element, und hat deshalb in einem inline element wie a nichts verloren.

Und wenn nicht, warum der Text aber trotzdem als Hyperlink funktioniert?

weil browser fehlerkorrekturroutinen haben, die oftmals über's ziel hinausschießen.

wofür glaubst du denn bei deinem beispiel die divs überhaupt zu brauchen?

gruß,
wahsaga