Cada elemento usa flex: grow shrink basis. Basis aporta el tamaño principal inicial antes de repartir espacio. Grow participa cuando sobra y shrink cuando los tamaños no caben. Los factores son proporciones, no píxeles, y dependen de los demás elementos de la misma línea.

Reparte el espacio positivo

Si dos elementos parten de 200px y quedan 300px, grow 1 y 2 dividen el sobrante en una y dos partes: 100px y 200px. Sus tamaños quedan cerca de 300px y 400px antes de otras restricciones. Grow cero no participa. La base porcentual usa el tamaño principal interior del contenedor; auto depende del tamaño aplicable o del contenido y debe probarse con contenido real.

Entiende shrink como negociación

El espacio negativo se pondera con flex-shrink y el tamaño base, así que factores iguales no siempre restan los mismos píxeles a elementos distintos. Los mínimos del contenido pueden detener la contracción y causar desbordamiento. FlexWeave solo emite flex: añade min-width: 0 u otra restricción en el componente tras probar palabras largas, imágenes, controles y zoom. Shrink cero protege un elemento pero pasa la presión a sus hermanos.

Verifica el componente real

FlexWeave representa el modelo visual validado con el navegador actual, pero desconoce tu contenido, modo de escritura, controles enfocables y anchos compatibles. Integra las reglas en el componente, conserva un orden HTML significativo y prueba anchos estrechos, zoom, traducciones largas, teclado y tecnologías de asistencia. La dirección inversa y order nunca demuestran una secuencia de lectura correcta. Guarda CSS y HTML en control de versiones porque la cápsula no conserva proyectos.