Link: Hintergrund für eine ganze Zeile

[Kalle_Worms]

Hallöle,

wie kann ich eine _ganze Zeile_ inkl. Leerzeichen als Link markieren?

habe Folgendes versucht:
a:hover, a:focus { background-color:#01826C; color:#fff; }

<a href='index.htm'><p class='ptre'>Willkommen<img src='img/icon_haken.gif' class='hide'></p></a>

Der Validator meldet:
Line 122, column 35: document type does not allow element "P" here; missing one of "APPLET", "OBJECT", "MAP", "IFRAME", "BUTTON" start-tag

Also kein <p> im <a>. Wenn ich's andersrum mache, wird nur das Wort, aber nicht die ganze Zeile markiert. Gibt's da einen Tipp?

LG Kalle

[Malte]

Hallo,

da Block-Elemente nur in anderen Block-Elementen und nicht in Inline-Elementen vorkommen dürfen, musst du den a-Tag auch zu einem Block-Element machen:
a:hover, a:focus { background-color:#01826C; color:#fff; display: block; }

dazu sei gesagt dass Browser (also nicht der IE) auch das verstehen, was semantisch schöner und trafficsparend wäre:
p:hover, p:focus { background-color:#01826C; color:#fff; }

[Kalle_Worms]

da Block-Elemente nur in anderen Block-Elementen und nicht in Inline-Elementen vorkommen dürfen, musst du den a-Tag auch zu einem Block-Element machen:
a:hover, a:focus { background-color:#01826C; color:#fff; display: block; }

Danke, das Ergebnis im Browser ist okay, aber der Validator mag's noch immer nicht.

Kalle

[wahsaga]

hi,

Danke, das Ergebnis im Browser ist okay, aber der Validator mag's noch immer nicht.

weil du <p> immer noch nicht aus <a> entfernt hast, oder warum ...?

gruß,
wahsaga

[Kalle_Worms]

Hi,

weil du <p> immer noch nicht aus <a> entfernt hast, oder warum ...?

Ach so, ich hatte verstanden, durch _display:block_ wird <a> zum Block und darf <p> enthalten.

Ich habe jetzt den <a> - Block in <p> gepackt. Es funzt wie vorher und der Validator gibt Ruhe.

Danke, Kalle

[wahsaga]

hi,

Ach so, ich hatte verstanden, durch _display:block_ wird <a> zum Block und darf <p> enthalten.

nein, natürlich nicht - CSS-formatierungen betreffen immer nur die anzeige, haben also logischerweise absolut keinen einfluss auf die struktur (HTML).

Ich habe jetzt den <a> - Block in <p> gepackt. Es funzt wie vorher und der Validator gibt Ruhe.

mit display:block versehen sollte auch <a> alleine "funzen".

gruß,
wahsaga

[MudGuard]

Hi,

da Block-Elemente nur in anderen Block-Elementen und nicht in Inline-Elementen vorkommen dürfen, musst du den a-Tag auch zu einem Block-Element machen:

a-Elemente dürfen in HTML nie p-Elemente enthalten - vollkommen unabhängig davon, wie die a-Elemente oder die p-Elemente per CSS formatiert werden.

@Kalle:
Laß das p ganz weg, gib dem a-Element display:block und width:100%.

cu,
Andreas