1

So, i am creating this webpage, that opens another page in the same directory on the click of a button. While doing so, I observed something which I couldn't find an satisfactory explanation to. The button code I am using is this

<a class="class1" href="webpage2.html"><button type="button">Button1</button></a>

this seems to work, but not this,

<button type="button"><a class="class1" href="webpage2.html">Button1</a></button>

Why is this so? (Am I missing something very simple?)

Arunava
  • 353
  • 1
  • 4
  • 13

1 Answers1

1
<a class="class1" href="webpage2.html"><button type="button">Button1</button></a>

and

<button type="button"><a class="class1" href="webpage2.html">Button1</a></button>

are different as one is a button inside an anchor tag...which means that, it is the anchor that gets clicked instead of the button, whereas, the second one, is an anchor tag inside the button.

In the first case, it is the click event of the anchor tag that gets worked instead of the button. In the second case, it is the click action of the button that is working and not the click action of the anchor tag. Thus, the href to webpage2.html doesnt work.

Lal
  • 14,726
  • 4
  • 45
  • 70
  • Yeah u r right, it seems that It is not allowed by html5 to have interactive elements as decendants. – Arunava Mar 14 '17 at 07:04