Grokking CSS Design Patterns to Ace Interviews/

...

/

Problem: Grid Gap Rhythm Layout

Problem: Grid Gap Rhythm Layout

Try to use CSS Grid with a 1.5rem row-gap and line-height to create a clean, aligned two-column text layout.

We'll cover the following...

Problem description

You have a container element with class .grid that lays out child <h2> headings and <p> paragraphs in a two-column CSS Grid layout. Your task is to implement a consistent vertical rhythm by:

  1. Defining a CSS custom property --rhythm as 1.5rem. ...