[DONE]<div> in <a> Valide gestalten
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
anklicken
aussehen
auswirkung
bereich
blocken
code
dank
display
eigentliches problem
element
erfahrung
erreichen
folgendes code
hilfe
span
speziell definierten bereich
stelle
tag
vergessen
wort
-
ho ;)
Ich brauche für ein Menü ein <div> tag/element">Element innerhalb eines <a> Tags.
Das ganze funktioniert auch wunderbar, nur valide (laut W3C) ist es leider nicht.
Nach kurzem Googlen wurde mir schnell klar warum: Block (div) Element in Inline (a) Element ist nicht gut...
Die angebliche Lösung: Den <a> Tag zu einem Block Element machen. (CSS: Display:block;)
Soweit so gut, hab das getan, hat am aussehen nichts verändert, aber valide ist es noch immer nicht :/
Habe schon einiges probiert... darunter folgendes:
#meineMenüListe a { display:block; } #meineMenüListe a:link { display:block; } .meineLinks { display:block; }
Habe auch probiert, den DIV zu Inline zu machen XD
Ging auch nicht h3h3h3
Habt ihr eine Idee, wie ich das ganze Valide bekomme?
Hoffe auf gute Vorschläge und bedanke mich im Voraus
Sincer -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Über CSS kannst du das vergessen: Der W3C-(X)HTML-Validator beachtet CSS nicht.
Du könntest in jedem <div>-Element einen extra <a>-Link machen. -
Warum brauchst du überhaupt ein DIV? Wenn du aus nemA-Tag nen Block machen willst nutze display:block;
-
Alternativ vielleicht <span> statt <div>? Dein eigentliches Problem stelle ich mir gerade ziemlich unlösbar vor ;)
-
Es geht darum, dass der anklickbare Link größer als das Wort ist.
Anders gesagt:
<a>Wort</a>
=> Man kann "Wort" anklicken...
<a><div style="...">Wort</div></a>
=> Man kann nicht nur "Wort" anklicken, sondern einen speziell definierten Bereich.
Letzteres will ich erreichen.
Wenn es anders geht, sagt bitte Bescheid :D
@tavern:
tavern schrieb: Alternativ vielleicht <span> statt <div>? Dein eigentliches Problem stelle ich mir gerade ziemlich unlösbar vor ;)
<span> ändert meiner Erfahrung nach nur das Aussehen, und hat keine Auswirkungen auf die Größe des Bereiches, oder irre ich mich?
@deutscher:
deutscher schrieb: Über CSS kannst du das vergessen: Der W3C-(X)HTML-Validator beachtet CSS nicht.
Du könntest in jedem <div>-Element einen extra <a>-Link machen.
Das das Stylesheet nicht vom Validator beachtet wird, wusste ich nicht...
Du meinst also folgendes:
<a><div><a>Link</a></div></a>
Das ist ja meines Wissensstandes auch nicht valide, da man zuerst den ersten a-Tag schließen muss, bevor man einen zweiten aufmachen kann.
(Und außerdem wäre noch immer ein Blockelement in einem Inlineelement...)
Gibt es noch Ideen, oder Vorschläge?
lg
Sincer -
sincer schrieb:
Es geht darum, dass der anklickbare Link größer als das Wort ist.
Anders gesagt:
<a>Wort</a>
=> Man kann "Wort" anklicken...
<a><div style="...">Wort</div></a>
=> Man kann nicht nur "Wort" anklicken, sondern einen speziell definierten Bereich.
Jein. Hierbei lässt du den Browser entscheiden, ob er sich nach den Standards richtet oder ob der Link anders dargestellt wird. Dein Ziel kannst du erreichen, indem du den Link über display:block; in ein Blocklevelelement umwandelst. -
Wieso stellst du dein A Element nicht einfach als Blockelement dar? Dann ist der klickbare Bereich auf jeden Fall größer als der eigentliche Text und du kannst Höhe, Weite, etc angeben.
-
@tavern:
tavern schrieb: Alternativ vielleicht <span> statt <div>? Dein eigentliches Problem stelle ich mir gerade ziemlich unlösbar vor ;)
<span> ändert meiner Erfahrung nach nur das Aussehen, und hat keine Auswirkungen auf die Größe des Bereiches, oder irre ich mich?
Richtig - aber du hattest ja nirgends erwähnt, dass du an der Größe des Bereichs was ändern willst. Somit wird tatsächlich am einfachsten sein, den Link in ein Block-Level-Element umzuwandeln, wie die anderen hier vorgeschlagen haben. -
Ahh, alles klar.
Mir fehlte die Insider-Info *hust*, dass man einem Block Element eine Weite/Höhe zuweisen kann h3h3h3
Vielen Dank für eure Hilfe ;)
thx
Sincer -
businessplan schrieb:
einfach so:
<a ....><span style="...">Wort</span></a>
Nein!
Span Elemente nutzt man heutzutage nur noch in Ausnahmefällen, also wenn man sonst keine Styling Möglichkeit mehr hat und hier benötigt man auf keinen Fall ein Span Feld. -
als Frage ist ja ...
Man kann nicht nur "Wort" anklicken, sondern einen speziell definierten Bereich
das sollte man noch mal klären ... meinst Du als "Bereich" einen Leer-Raum vor und nach dem "Wort" ??
dann mit CSS .... display:block oder mit padding im a ?!?
<div class="blocklink">
<a href=....>Wort</a>
</div>
.blocklink a {
display: block;
}
damit geht der Klick-Bereich über die ganze "verfügbare" breite
oder geht auch
.blocklink a {
padding: 2px 10px 2px 10px
}
oder
.blocklink a {
width:160px;
text-align:center;
}
oder wie?
-
Padding im A funktioniert nur mit Display Block vernünftig.
Mal davon abgesehen kann man das THema solange sich der TE nicht meldet als abgeschlossen betrachten. -
ho ;)
Danke für die Nachdiskussion, aber ich habe / mir wurde das Problem im weitesten Sinne gelöst.
Habe den A-Tag zu einem Blockelement gemacht, diesem eine Weite gegeben, und mit margin und padding zurecht gerückt.
Also genau, wie du es nochmal gepostet hast.
Alles Schwierigkeiten, die sonst noch damit habe hängen nicht damit zusammen, wie weit der Link vor und hinter dem Wort anklickbar sind, sondern ums drum herum. ^^
Das Problem habe ich aber Theoretisch auch schon gelöst...
Falls sich in der Praxis herausstellt, dass es doch nicht funktioniert, melde ich mich wieder :P
Danke euch allen für eure Hilfe :)
thx
Sincer -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
