Skip to content
techsnow

Inline & Block Elements

Block Elements

Every HTML element has a default display type. The two most important are block and inline.

A block-level element:

  • always starts on a new line,
  • stretches to fill the full width of its container,
  • can have width, height, margin and padding on all sides.

Common block elements:

<div>  <p>  <h1>...<h6>  <ul>  <ol>  <li>
<table>  <form>  <header>  <footer>  <section>  <article>  <nav>

Example:

<p style="background: lightblue;">I am a block. I take the whole line.</p>
<p style="background: lightgreen;">So I start on a new line.</p>