Level Up: CSS Layout
1h 26mIntermediate2022-11-09
Authors
Morten Rand-Hendriksen
Senior Staff Instructor, Speaker, Web Designer, and Software Developer
Course details
This course with Morten Rand-Hendriksen tests your knowledge with 15 CSS layout challenges exploring the opportunities and intricacies presented by modern CSS layout modules. Challenges range in scope from component-level layouts like horizontal menus to sitewide layouts and responsive layouts across multiple viewport widths. If you want to see how your skills stack up or just learn something new, join Morten for this course.
Skills covered
Responsive Web DesignCSSWeb StandardsWeb DesignFront-End Web DevelopmentWeb DevelopmentOpen SourceOne-Off
Concepts
0. Introduction
- 01 - Sharpen your CSS layout knives
- 02 - What you need to know
- 03 - Sharpen your CSS layout knives
- 04 - Using GitHub Codespaces with this course
1. CSS Grid Layout Challenges
- 05 - Center content horizontally and vertically
- 06 - Navigation menu alignment
- 07 - Grid with featured content
- 08 - Equal-height columns
- 09 - Full-page and two-way split
- 10 - Holy grail layout
- 11 - Pull quotes
- 12 - Full-bleed sections
- 13 - Responsive card
- 14 - Multi-card layout
- 15 - Dynamic card
- 16 - Dynamic wrapping multi-card layout
- 17 - Dynamic grid gallery
- 18 - Paged layout