@steventoben
Posted
Good job on your first CSS challenge! A couple things I want to point out just in case you didn't realize because they're useful tips: On your 3 divs that are children of the grid container div, you don't have to explicitly set a height. Removing the height will make it take up the size of the row of your grid, which is pretty much the same size as you set. Nice job of using grid-areas and naming them. For your 2nd and 3rd div you actually don't even need to set the grid-area property because with the way grid works, the next child will take up the next grid area available. So if you removed the grid-area: box-2(and 3) it would actually result in the same thing. Just a couple useful grid tips I thought I'd share.
When you do set something's height, try to use max-height or min-height (same goes for width) and try to set it using rem units. Rem units make the application much more responsive and it helps with accessibility. Good job using rem everywhere else tho like on padding and border-radius!
Nicely done, especially for your first CSS challenge! Just thought I'd share some tips about css-grid and rem units!
@Comet466
Posted
@steventoben Wow Steven thank you soo much for taking the time of going through my code now i understand the grid a little better thanks to your tips, i already applied them in the repository and it works wonders.
