I have a grid and the code is like this
width: 100%; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 300px)); margin: 0 auto; }
It functions like I want , but the problem is that I can't center it .
I also tryed this
top: 50%; left: 50%; transform: translate(-50%, -50%);
Solved! Solved! Go to Solution.
Not a CSS expert but after reading this , I think the problem is the "width: 100%" line. I believe that means you want the grid to take up 100% of the width of the page, so centering becomes irrelevant. Try removing that line, or at least initiallly, set the width to a fixed px value.
Please follow-up to let us know how you made out. For good karma, mark a reply as the answer if it helped!