A Perfect Square with CSS

Tyler Duprey
4 min readJul 25, 2020

Make a perfect square with CSS that fluidly adjusts to the width of its container. Thanks Dave Rupert for this trick.

Step 1: Add an empty DIV tag

There’s only one line of HTML for this project. It’s an empty DIV tag.

<div></div>

Now, let’s add a class that we can target. The class you use is only limited by your…

--

--

Tyler Duprey

I am a professional web developer in Ontario, Canada. Learn Web Development for Free.