@supports (display: grid) {
main {
max-width: 10000px;
margin: 0;
}
.grid-container {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 2fr));
grid-gap: 1rem;
}
}
.wrapper {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
grid-template-columns: repeat(auto-fill, minmax(value, 1fr));
.smol-css-grid {
--min: 15ch;
--gap: 1rem;
display: grid;
grid-gap: var(--gap);
/* min() with 100% prevents overflow
in extra narrow spaces */
grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--min)), 1fr));
}