Three Column Preview Card using basic CSS custom properties

Hi Rachel Pizane, I have seen in your code you are using pixels unit for fonts it not effective incase responsiveness so, try to use em or rem for fonts. I also see this in your code: main { place-self: center; }

.box { display:flex; margin: auto; width: fit-content; border-radius: 5px; overflow: hidden; box-shadow: 1px 1px 7px #cccbcb; } you wrapped your content with div class="box" even there is main to wrap everything so I suggest you to use main directly to style or give class to the main

overall your code is good and clear do this simple steps to achieve even more simple and clear code.

Hello Rachel!

Your solution looks excellent!

About your question on when to use flex or grid:

Flex is recommended when you have to work with a horizontal OR a vertical container. Rows OR columns.

Grid is recommended when you have to work with both rows and columns simultaneously inside a container.

This project has a big horizontal container with three smaller vertical containers. Flex is good for cases like this.

I hope it helps!

I believe as a developer - a relatively new one at that - you do whatever you have to do, to get the desired result, so don't worry yourself too much for using a particular property too much. somthings i noticed:

• you don't want to hardcode the height of the body, instead of height: 100vh; use min-height: 100vh; instead
• padding on the body too isn't necessarily bad, but it isnt commom practice

to name a few, overall, good job