Grokking CSS Design Patterns to Ace Interviews/

...

/

Solution: Legacy Fallback Equal Height Columns for IE11

Solution: Legacy Fallback Equal Height Columns for IE11

Let’s implement an equal height two-column layout using CSS Grid with a table-cell fallback for IE11 via feature queries.

We'll cover the following...

Problem description

A .layout container holds two .panel elements. The task is to:

  1. Use CSS Grid (grid-template-columns: 1fr 1fr) in modern browsers.

  2. Detect Grid support via ...