Inline Element Summary

Inline elements are HTML elements that take up no more space than their content. They either are content, or they help you format text.

<img src="image url"/>
<input type="text"/>
<a>A Link</a>
<span>Red Text</span>
<i>italics</i>

Inline elements can be the content, like an image, an input, or a link. They can also be boxes you wrap around content to change their appearance like the span tag or text formatting tags like bold and italics.

Inline Element Traits

  • Does not create a new line
  • Only the width of the content
  • Does not allow width or height
  • Does not allow vertical margins or vertical padding

In contrast, block elements can take up added space on the page and push other elements below them. They are boxes for content that help you create layouts.

Code Sandbox