My HTML button doesn't work. Anything wrong?

Question

I just wanna ask if there is anything wrong with my button code.. here it is:

<button id="stop" type="Submit" class='btn btn-primary mx-sm-2 mb-1' href="/roles/meditation/meditate-timer/stop/">Stop</button>

The button should have redirected us to the url, but when i serve the file from localhost (I'm using Django), nothing happened. The button is not functional. I have inspected the element and found no error. Anyone has an idea why?
Thank you in advance!

Answer 1

I just wanna ask if there is anything wrong with my button code.. here it is:

<button id="stop" type="Submit" class='btn btn-primary mx-sm-2 mb-1' href="/roles/meditation/meditate-timer/stop/">Stop</button>

The button should have redirected us to the url, but when i serve the file from localhost (I'm using Django), nothing happened. The button is not functional. I have inspected the element and found no error. Anyone has an idea why?
Thank you in advance!

Answer 2

Buttons do not support the href attribute. You can use an <a> tag (styled as a button) instead:

<a id="stop" type="Submit" class='btn btn-primary mx-sm-2 mb-1' href="/roles/meditation/meditate-timer/stop/">Stop</a>

CSS:

a {
  padding: 10px;
  border: 1px solid blue;
  text-decoration: none;
}