Possible Duplicate:
Is putting a div inside an anchor ever correct?
I want to have a link on a complex element (containig images, paragraphs and other stuff).
I know it works, but is it ok to have a <div> element inside an <a> element ?
Is it ok to place a
Asked
Active
Viewed 493 times
3 Answers
6
Yes … and no.
No complete HTML or XHTML recommendation allows it.
The HTML 5 draft does permit it, but you may have to do things such as explicitly setting display: block on the anchor to get it to work in some browsers. You may find that others simply don't support it (I'd like to be able to link to a reference that shows browser support for this, but don't know of one, please comment if you do.)
That said, while have nice big click targets can be useful, it isn't an approach that is friendly to the "skim through links mode" that some browsers (especially screen readers) have. You might be better off using a regular link in the content, and applying some JavaScript to react to a click on the whole element.
Quentin
- 914,110
- 126
- 1,211
- 1,335
1
In XHTML1.0 and HTML4.01: no. a is an inline element that can only contain other inline elements (but not another a).
In HTML5: yes, you are allowed to do that. BUT consider why you would've hundreds of characters in a link.
It's bad for SEO (dilution I believe) and bad for many disabled users ("Hey screen reader, tell me what does this link do?" - "Let me read to you aloud this link for half a minute") and perhaps bad for usability.
Another solution would be to put a link on say your heading in your div or some meaningful text. Then in JS make your div behave like what you wanted to do initially. Then it'll work for users using an assitive technology (screen readers and alike), for keyboard users (they can tab through the link) AND for sighted mouse users with JS.
FelipeAls
- 21,711
- 8
- 54
- 74
0
No, unless you don't care about IE7 and down. The link will not function properly in IE7, even if set to display:block.
smdrager
- 7,327
- 6
- 39
- 49
Asked
Active
Viewed 493 times
3 Answers
6
Yes … and no.
No complete HTML or XHTML recommendation allows it.
The HTML 5 draft does permit it, but you may have to do things such as explicitly setting display: block on the anchor to get it to work in some browsers. You may find that others simply don't support it (I'd like to be able to link to a reference that shows browser support for this, but don't know of one, please comment if you do.)
That said, while have nice big click targets can be useful, it isn't an approach that is friendly to the "skim through links mode" that some browsers (especially screen readers) have. You might be better off using a regular link in the content, and applying some JavaScript to react to a click on the whole element.
Quentin
- 914,110
- 126
- 1,211
- 1,335
1
In XHTML1.0 and HTML4.01: no. a is an inline element that can only contain other inline elements (but not another a).
In HTML5: yes, you are allowed to do that. BUT consider why you would've hundreds of characters in a link.
It's bad for SEO (dilution I believe) and bad for many disabled users ("Hey screen reader, tell me what does this link do?" - "Let me read to you aloud this link for half a minute") and perhaps bad for usability.
Another solution would be to put a link on say your heading in your div or some meaningful text. Then in JS make your div behave like what you wanted to do initially. Then it'll work for users using an assitive technology (screen readers and alike), for keyboard users (they can tab through the link) AND for sighted mouse users with JS.
FelipeAls
- 21,711
- 8
- 54
- 74
0
No, unless you don't care about IE7 and down. The link will not function properly in IE7, even if set to display:block.
smdrager
- 7,327
- 6
- 39
- 49