¿Cómo especificar el número máximo de columnas que se repetirá () creará usando autoajuste / relleno?

Hay alguna manera, sin usar la consulta de medios, para limitar el número de columnas que se crean y combinarlo con autoajuste / relleno?

Por ejemplo

grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));

Crea un diseño maravilloso y receptivo. Pero imagine que el diseño requiere un máximo de 3 columnas, incluso en navegadores anchos. Felizmente mostraría, 4, 5, más columnas según lo permita el espacio.

Utilizando la consulta de medios, podría especificar que las pantallas grandes obtengan:

grid-template-columns: 1fr 1fr 1fr;

Y las pantallas más pequeñas obtienen:

grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));

Pero eso se siente mal. ¿Hay alguna manera de decirle a mi diseño de cuadrícula que se repita hasta un máximo de n veces y aún así usar la repetición y el ajuste / relleno automátic

Update: Esto no es un duplicado de: ¿Cómo limitar la cantidad de columnas en ventanas gráficas más grandes con CSS Grid y autocompletar / ajustar?

Estoy preguntando cómo hacer que el código para la ventana gráfica también funcione para ventanas más pequeñas. La pregunta (y la respuesta) mencionadas anteriormente solo llega al punto de partida de mi pregunta.

Respuestas a la pregunta(2)

Su respuesta a la pregunta