Build Modern Layouts with CSS Grid by Hiroko Nishimura

• Define Root Colors Variables and Set up Box-Sizing for a CSS Layout
• Introduction to CSS Grid Rows and Columns with display: grid
• Specify a Gutter in CSS Grid with gap (grid-gap)
• Utilize Firefox Developer Tools to Visualize CSS Grid Styles
• Determine CSS Grid Sizing with the Fraction Unit (fr)
• Define a Page Layout with CSS Grid Using grid-template-areas
• Align Content by Adding Styling to a CSS Grid Layout
• Build a Navigation Bar with CSS Grid Using grid-auto-flow
• Create a Nested CSS Grid Layout
• Use the repeat() CSS Function to Efficiently Define CSS Grid Rows and Columns
• Define Size Range with the minmax() CSS Function to Create Responsive Grid Items
• Create a Responsive Layout Using Media Queries with CSS Grid
• Use grid-auto-flow and Media Queries to Flip Navigation from Horizontal to Vertical