Fluid Columns Max3

fluid-columns.css

--max-columns: 3;
--min-column-width: 12rem;
--gap: 1rem;

/* Source: https://www.neatcss.dev/fluid-columns-max/ */
.container {
  display: grid;
  grid-template-columns: 
    repeat(
      auto-fit,
      minmax(
        min(100%, max(var(--min-column-width), 100%/var(--max-columns) - var(--gap))),
        1fr));
  grid-gap: var(--gap);
}