Small screen layout

Video playlist walking you through creating a basic, small-screen website using all the techniques so far: semantics, typography, box model, float & position.


Referenced lessons

This basic website combines together all the knowledge and skill from the following lessons.

  1. HTML semantics
  2. Using CSS
  3. Basic typography
  4. The box model: everything is a box
  5. Flow & display
  6. Float & clear
  7. Position & z-index
  8. Navigation

Video list

  1. Small screen layout: setup & header
  2. Small screen layout: blockquote
  3. Small screen layout: databox
  4. Small screen layout: figures & columns
  5. Small screen layout: section separator
  6. Small screen layout: banner
  7. Small screen layout: dinosaur list
  8. Small screen layout: footer