Test 1: The Perfect Circle

 Hi, today we're focusing on a really really basic drawing. Let's see if we can draw a circle.

We've drawn an ellipse instead of a circle. This is because screens are rectangular.

Let's use pixel values and manually size it for every possible screen size.

Okay, it's not feasible to actually do that. 

So, using `vh` and `vw` units might be our next go.

So, have we found a way to represent a circle on every screen size?

You tell me. I really do think this is the solution.

Till next time!

CodePen Link

Third Post

Hi,

To continue where we left off all those fateful years ago,

I found using Inspect Element that we were looking for a div with id="header-inner"

CSS:

    <style>

        body{ /* what we added before */ }

        #header-inner{ width: 100% !important; }

    </style>
         

This fixed the image overflowing the width of the header.

Here's what it looks like now:

Thank you, hope to see you again soon.