Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is it semantically valid to put a <button> inside a <h2>?

I have a header element which needs to fire off some JavaScript when clicked. I know I should only use <a> tags when the page is actually changing, and that <button>s are preferred for JS functions, but for some reason it just feels wrong to do

<h2><button onclick="myFunction();">My Title</button></h2>

I can't put my finger on why that doesn't feel semantically correct. Is it just me?

like image 576
sanjaypoyzer Avatar asked May 12 '14 21:05

sanjaypoyzer


1 Answers

According to W3C Validator, there's no problem in doing that.

You can try validating this code:

<!DOCTYPE html>
<html>
<head>
   <title>I AM YOUR DOCUMENT TITLE REPLACE ME</title>
</head>
<body>

<h2><button onclick="myFunction();">My Title</button></h2>

</body>
</html>

However, I suggest avoiding inline styles.

like image 80
Oriol Avatar answered Sep 16 '22 16:09

Oriol