Grokking CSS Design Patterns to Ace Interviews/

...

/

Solution: Fullscreen Section with Content Alignment

Solution: Fullscreen Section with Content Alignment

Let’s pin elements to each corner of a fullscreen section that resizes with the viewport.

We'll cover the following...

Problem description

Given a <section class="fullscreen-section"><div class="top-left"></div><div class="top-right"></div><div class="bottom-left"></div><div class="bottom-right"></div></section>, write CSS so each div is always visually aligned with its respective corner of the viewport, ...