Part 7: Media Queries

Media queries allow different declaration blocks to be called in different conditions -- most useful in viewport width.

What we'll cover

• Syntax for media query

Exercise: Change one flag to another

Using flex or grid, create a simple flag (your own country?). Change that flag to two other designs at two breakpoints (720px width and 360px width).

Resources

• w3 schools on media queries
• MDN on queries
• Ethan Marcotte on Responsive Design
• More on queries