32 CSS media queries and responsive web design

Here we cover the crucial elements of responsive web design: How to write media queries; how to determine breakpoints; how to use the max-width property to best advantage (both for images and for other elements); how to use the viewport meta tag correctly.

Responsive web design enables us to style an HTML document once, with one CSS stylesheet, to RESPOND WELL on all sizes of devices from smallest to largest. It definitely requires some experience with CSS before you can do it well.

+++

Here is a GitHub repo of simple responsive web design EXAMPLES:

https://github.com/macloo/responsive-examples

https://macloo.github.io/responsive-examples/

+++

THIS IS RESPONSIVE by Brad Frost

https://github.com/bradfrost/this-is-responsive

http://bradfrost.github.io/this-is-responsive/patterns.html