Is this html valid (button link)

Question

I require a button to be a link to a new window.

My code works in all desktop browsers I have tried so far, however when I run it through the W3C validator I get the error below;

The element button must not appear as a descendant of the a element.

<a href="http://www.example.com"><button type="button" class="btn btn-success">contact</button></a>

If somebody could tell me how it should look in order to be sematically correct I would be very grateful.

Note I am using the bootstrap framework hence the btn class.

Why put a button within a link when you can use bootstrap to style the link itself to look like a button? http://www.bootply.com/3IjtTsDtgr — j08691, Feb 27 '15 at 15:05
Yes this is invalid. Button inside link and link inside button are both incorrect. See http://stackoverflow.com/questions/6393827/can-i-nest-a-button-element-inside-an-a-using-html5 — Salman A, Feb 27 '15 at 15:06

score 3 · Answer 1 · answered Feb 27 '15 at 15:06

3

You probably don't need a <button> element, so just remove it and move class argument into <a> element:

<a href="http://www.example.com" class="btn btn-success">contact</a>

answered Feb 27 '15 at 15:06

marian0

score 2 · Accepted Answer · answered Feb 27 '15 at 15:07

2

You already answered your question. The HTML is invalid.

Just give the a element the classes that the button element had:

<a class="btn btn-success" href="http://www.example.com">contact</a>

Example Here - the appearance is the same.

answered Feb 27 '15 at 15:07

Josh Crozier

score 0 · Answer 3 · answered Feb 27 '15 at 15:07

No, it is not valid.

The HTML should look like:

<a href="http://www.example.com">contact</a>

(With whatever classes you want to add). You can then style the link to look however you like.

You should use a button instead of a link if you want to submit a form or have a non-link that triggers JavaScript.

3 Answers3