Suggestion on my first grid layout

[aliibra9214]

Hello everyone im a beginner in css I’ve make this grid layout
any suggestion to improve the code will be appreciated
this is my codepen link

idk why , when i put it in the codepen it appears like this

[mrfantasticllc]

I would love to help you. Code is way to advanced for me at this moment. Grid layout is difficult I have heard. The only thing I can see is the alts are not there for the pic, That and the size can make pic not show.

[saurabhv749]

hey @aliibra9214 if you are familiar with minmax, repeat, 1fr and auto-fit
you could create the layout you want. grid is just advanced version of flex.

repeat(2,100px) means 2 columns with width of 100px

now take a look at this code snippet

  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));

all this is doing is fitting (auto-fit )max number of cards
with width in between 200px to max width available

HERE IS LIVE EXAMPLE
Responsive CSS grid

[saanvisenpix]

Hi, I t seems good but the alts for the image are missing, which, combined with the image’s size, may cause it to not display. I also agree with the @ saurabhv749 regarding the width recommendation.