CSS Grid Issue
Hello,
I'm having an issue that I'm trying to work around without having to rebuild my layout. I used CSS grid to build a marketplace layout, defined by:
grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr));
This works perfectly fine, as long as there's enough content to fill. However, when there's not enough content, it looks something like (picture #2). What should I try to do in order to fix this?
4 Replies
remove the width on the cards so they can adjust to the grid columns width. also don't have a height on the container
There’s no width on card
And container has height because there’s there’s fixed height on aside filter
the guys in here can help you more efficiently if you like your relevant code in a sandbox like https://codepen.io
CodePen
An online code editor, learning environment, and community for front-end web development using HTML, CSS and JavaScript code snippets, projects, and web applications.
its easier to see whats there than try to rule out what MIGHT be the problem