Discussion: 06-shopping-cart CSS

Buenas, Me permito abrir una issue para aclarar una duda en el CSS que no está muy clara. De hecho, se le ve dubitativo al propio Miguel durante el directo. También me he permitido traladar el codigo a un sandbox por si alguien quiere probar rapidamente el cambio al activar y desactivar el flex container.

https://codesandbox.io/s/headless-paper-m7i8r4?file=/src/components/Products.css

Para enfatizar el efecto he aumentado el max-width del #root a 1200px

CODE: Las líneas de código son las siguientes: https://github.com/midudev/aprendiendo-react/blob/a75a5d5d139e481c117bc77febc66c3c6f94b84b/projects/06-shopping-cart/src/components/Products.css#L1-L6

ISSUE: Un contenedor flex envuelve a un grid

WHY IS AN ISSUE: El flex container que envuelve al grid container hace que el grid se limite a dos columnas, y pase a 1 en pantallas pequeñas. Pero a mi parecer elimina el efecto repeat autofit min max del grid.

MEDIA Flex container desactivado Screencast from 17-02-2023 09:37:05.webm Flex container activado

Gracias de antemano