Results summary component

A lot of it requires a container div as far as I can tell and in my own experience. Without having a container that spans both height and width, then you would more likely have to hard code it using transform: translate, margin, and etc... but hard coding are never really good and is not really responsive. The easiest solution would be having to have a container that span both width:100%, height: 100vh, and display the container to flex and then you use justification-content: center; and align-items: center;. It will display the contents to the center of the screen.

Here is a video that I like that I found in youtube made by @Fireship: https://www.youtube.com/shorts/njdJeu95p6s

Hey @TKD5

Nice work.

There is a very easy and optimal way to center a div.

<div class = "container"> <div class = "wrapper"> </div> </div>

Let's say we want to center the 'wrapper' div.

Simply, we can give <container> a height of 100vh and a width of 100vw. This will span the container to the entire screen.

Now, give these properties to <container>

display: flex; justify-content: center; align-items: center;

And, voila! your <wrapper> div will be centered!

Let me know, if you need any other help.