Media queries layout

Video playlist walking you through manipulating a website with media queries.

Referenced lessons

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

  1. All devices setup
  2. Media queries

This layout uses a navigation called the Footer-Toggle Hybrid. It isn’t described in the Navigation tutorial, but essentially takes the Footer-Anchor pattern, and adds some progressively enhanced JavaScript to turn it into a Toggle navigation.

Video list

  1. Media queries layout: Navigation
  2. Media queries layout: Text and images
  3. Media queries layout: Statistics
  4. Media queries layout: Footer
  5. Media queries layout: Larger screens