@Sicro01
Posted
Hi,
Looks good - only one suggestion....
If you view the site on a much larger screen size there is no constraint on the width of the cards. Not a big issue for this site but it you wanted to experiment you can achieve this by changing your "grid-template-columns" statement:
From: grid-template-columns: repeat(4, 1fr);
To: grid-template-columns: repeat(4, minmax(smallest size, largest size));
Replace the smallest/largest with whatever works; you can also adjust the repeat aspect if different column need different sizes. The "largest size" sets the max width of the column.
One further tip - you could set the sizes using a CSS variable, defined say in your root (as you've done with your font) and play around with the numbers there.
Good luck!
@GiuliaT97
Posted
It is true! I forgot to set a max-width.... I'll use the method you suggested, thanks.@Sicro01