Reputation: 167
I have a button inside an a tag, that should be focusable via the tab key.
<a href="#">
<button tabindex="0">Do something</button>
</a>
Using the Firefox property accessibility.tabfocus = 7, I can only focus the wrapping link, but not the child button. Is there a way to change this behavior?
Upvotes: 0
Views: 315
Reputation: 17435
Even if you could get this to work, it is not valid HTML so could easily break on any browser or, if it happens to work now, it could break in the future.
<a>
spec says:
Content model: Transparent, but there must be no interactive content or <a> element descendants.
Because the code is not valid HTML, it would fail WCAG 4.1.1.
Success Criterion 4.1.1 Parsing: In content implemented using markup languages, elements have complete start and end tags, elements are nested according to their specifications, elements do not contain duplicate attributes, and any IDs are unique, except where the specifications allow these features.
Upvotes: 4