I have never used CSS Grid before, so please excuse me if this is a simple question. I need to make a grid that is 30 columns wide - auto-width that adjusts with the browser window or parent div. I've read through the documentation but I can't seem to find code that simply creates x number of auto-width columns. How can I accomplish this?
Asked
Active
Viewed 411 times
1 Answers
2
.grid-container {
display: grid;
grid-template-columns: repeat(30, 1fr);
}
That code creates a grid container with 30 columns, each of which has an equal proportion of the free space on the row. You can also try replacing 1fr
with auto
(content width) or min-content
(the minimum column width after all line breaks are taken).

Michael Benjamin
- 346,931
- 104
- 581
- 701