@media
Adapt layout at smaller viewports.
Flex, grid, responsive constraints, media queries, and wrapping.
Build flexible rows inside the persistent Volunteer check-in: Flexible rows starter project.
Core 02 Layout and responsive Layout and responsive: Wrapping navigationBuild wrapping navigation inside the persistent Local event guide: Wrapping navigation starter project.
Core 03 Layout and responsive Layout and responsive: Two-column gridBuild two-column grid inside the persistent Study group board: Two-column grid starter project.
Core 04 Layout and responsive Layout and responsive: Repeatable card gridBuild repeatable card grid inside the persistent Public resource hub: Repeatable card grid starter project.
Core 05 Layout and responsive Layout and responsive: Minmax tracksBuild minmax tracks inside the persistent Creative portfolio: Minmax tracks starter project.
Core 06 Layout and responsive Layout and responsive: Stable gapsBuild stable gaps inside the persistent Course dashboard: Stable gaps starter project.
Core 07 Layout and responsive Layout and responsive: Intrinsic sizingBuild intrinsic sizing inside the persistent Service status page: Intrinsic sizing starter project.
Core 08 Layout and responsive Layout and responsive: Content-width constraintsBuild content-width constraints inside the persistent Project launch page: Content-width constraints starter project.
Core Checkpoint 09 Layout and responsive Layout and responsive: Responsive imagesBuild responsive images inside the persistent Accessible recipe: Responsive images starter project.
Core 10 Layout and responsive Layout and responsive: Mobile media queryBuild mobile media query inside the persistent Reading list: Mobile media query starter project.
Core 11 Layout and responsive Layout and responsive: Desktop media queryBuild desktop media query inside the persistent Support center: Desktop media query starter project.
Core 12 Layout and responsive Layout and responsive: Source orderBuild source order inside the persistent Team directory: Source order starter project.
Core 13 Layout and responsive Layout and responsive: Overflow preventionBuild overflow prevention inside the persistent Field notes: Overflow prevention starter project.
Core 14 Layout and responsive Layout and responsive: Responsive layout checkpointBuild responsive layout checkpoint inside the persistent Civic calendar: Responsive layout checkpoint starter project.
CoreCreate a free account to sync completed lessons, XP, streaks, course status, and your next lesson across sessions.
Checking account status...
Progress sync is idle.
Progress sync stores completion IDs, scores, streaks, badges, and game settings. Terminal contents, editor snippets, lab scratch, email, and real names are never published on leaderboards or share cards.
@media
Adapt layout at smaller viewports.