Week 4: <UL>TR4 L1STS, 4NCH0R P0W3R, & B0X M4G1C
DESN 368 · Spring 2026 · Week 4
Assignments & Activities This Week
week 4 walk throughs
External resource
week 4 / day 1 slide deck
External resource
week 4 milanote
External resource
Named Color Values
External resource
Day 1
wk4 - css // recipe in style
Assignment · 30 pts
wk 4 - p&e // css foundations from TOP
Assignment · 10 pts
wk 4 - r&d // weekly visual notes
Assignment · 10 pts
Day 2
p 2.15 - tribute site peer review
Assignment · 10 pts
wk 4 - Engagement: CSS Diner
Assignment · 5 pts
wk 4 - In Class: Mozilla DevTools Tutorial
Assignment · 15 pts
Interactive Tutorials Hands-on
The Story of the Box
Hover and click elements to see their content, padding, border, and margin live. The box model, made visible.
box-sizing — an interactive lesson
Step through how content-box vs border-box changes the way width and height are calculated.
Fonts & Google Fonts
How web fonts work, how to load Google Fonts, and how to apply them with CSS.