Click here to navigate the course.

Drag the edges to resize the window.

In Projects, you can keep track of your progress as you go throught the tasks. Check each item as you complete it!


Using borders, padding, and margins allows us to control boundaries and space for individual HTML elements.

But what CSS properties are available to move elements around on the page and create unique page layouts? The CSS display and position properties help accomplish this.


Not all HTML elements are displayed on a page in the same way. Display types determine how HTML elements will be arranged in relation to each other.

The diagram to the right illustrates the block and inline display types.


In the diagram, notice:

  1. The two dotted rectangles represent webpages.

  2. HTML heading, paragraph, and unordered list elements are block level: each appears on its own line on the webpage.

  3. HTML image and anchor elements are displayed inline: they appear on the same line as their neighboring elements on the webpage.

Familiarize yourself with block and inline display types, then click Next to continue.

Report a Bug
If you see a bug or any other issue with this page, please report it here.