What is the difference between the "input" tag type of submit and an actual "button" tag of submit?

Sometimes, submit buttons are created with an “input” tag/element and at other times, they are created directly with a “button” tag/element. What is/are the differences between these two cases?

https://www.codecademy.com/paths/web-development/tracks/learn-html-web-dev-path/modules/learn-html-forms/lessons/html-forms/exercises/submit-form

Hey there @noblekc :grinning:

Both the <input> element and the <button> element can be used to do the same thing. However there are key differences.

The biggest of these is that the <input> element is self closing, meaning it can’t contain other elements.

<input type="submit> <!--there is no closing tag-->
<!--Because of this it can't be a parent element-->

Where as the <button> element can have a closing tag, and can be a parent to other elements such as <p> or <img>

<button>
  <img src="insert file path here">
</button>  <!--closing tag allows for child elements such as pictures--> 

Hopefully this is helpful :slight_smile:
Here are a few resources you could look at:

tutorialspoint.com/What-is-difference-between-button-vs-input-type-button

2 Likes

NIce insight. Thanks.

That was helpful, thanks a lot!