Inline Display

Another option for element display is inline. Elements with this display share a line with other elements and we cannot manually set their width or height.

Examples of elements displayed inline by default:

  • Hypertext links (a)
  • Italic text (em)
  • Bold text (strong)
  • Text fragment (span)

As you can see, these are often elements that modify a portion of text.

Similar to setting block display, we can also set inline display. Like this: display: inline;

Instructions

Set the second-level headings (h2) to display inline.

Notice that the headings remained on their own line.

This is because the paragraph is still a block element and therefore gets placed on its own line. In order to have both elements on the same line, we need to set both the h2 element and the p element to display inline.

Set the paragraphs (p) to display inline.

Start programming for free

By signing up, you agree to the Terms of Service and Privacy Policy.

Or sign up with:

3/10