Responsive Design Day 1
Build the first layer of responsive thinking: fixed-width pages, fluid widths, the viewport meta tag, media queries, and content-driven breakpoints. You will finish with a small page that adapts from 320px to 1400px without advanced layout systems.
Each module follows the same rhythm: observe the problem, learn the concept, try a small edit, then pass the checkpoint. Drag the right edge of a preview to test different viewport widths. Your work autosaves in this browser, and you will download a completed HTML file for Canvas.
Use this panel before you submit. Progress saves locally as you work. Download the completed HTML file and upload it to Canvas. The HTML copy includes your saved progress inside the file.
Finished? Download your completed HTML file.
Click this button, then upload the downloaded .html file to Canvas. This file includes your saved quizzes, reflections, and live-editor code.