Learn Intermediate CSS

Learn how to implement elegant transitions, create new layouts and serve users with dynamic needs.

### Why Learn Intermediate CSS?

You've figured out the basics of CSS, and your web pages are full of pretty colors and evocative fonts. But you want to do more! With Intermediate CSS, you'll learn how to recreate the dynamism and the visual effects that you see on professional sites around the web.

### Take-Away Skills

By the end of Learn Intermediate CSS, you'll know how to implement elegant transitions, create new layouts with ease, and give your website the flexibility to serve users with different window dimensions, browsers, and physical abilities.

### Note on Prerequisites

We recommend that you complete Learn CSS before starting Learn Intermediate CSS.

• Layout with Flexbox: Learn CSS Flexbox to create flexible page layouts.
• Lesson: Flexbox
• Project: Flexbox: To-Do App
• Project: Off-Platform Project: Tea Cozy
• Quiz: Flexbox
• Grid: In this course, you will master a technology that was recently added to CSS! This is a long-awaited improvement to laying-out and positioning elements on web pages.
• Lesson: Grid Essentials
• Project: PupSpa
• Quiz: Grid
• Lesson: Advanced CSS Grid
• Project: CSS Grid: Task Board
• Quiz: Grid
• CSS - Transitions: Implement CSS animation using transitions
• Lesson: CSS Transitions
• Project: Transitions - 20,000 Leagues Under the Sea
• Quiz: Transitions
• Learn Responsive Design : Learn responsive design techniques, like relative sizing units and media queries, to create websites viewable on devices of all sizes.
• Lesson: Sizing Elements
• Lesson: Media Queries
• Project: Tsunami Coffee
• Quiz: Sizing Elements
• Quiz: Media Queries
• Variables and Functions: Learn how to use CSS variables and functions to create more organized, efficient, and dynamic websites.
• Lesson: CSS Variables
• Lesson: CSS Functions
• Project: Curious Ornithologist
• Quiz: Variables and Functions
• Accessibility: Learn how to build web pages that are accessible to everyone using modern CSS techniques and accessibility standards.
• Lesson: Accessibility
• ExternalResource: Start Testing for Web Accessibility
• Project: Code! Blog
• Quiz: Accessibility
• Browser Compatibility: Learn about browser compatibility and the different techniques to create a consistent user experience regardless of the browser.
• Lesson: Browser Compatibility
• Article: CSS Feature Queries
• Quiz: Browser Compatibility