Each generated item uses flex: grow shrink basis. Basis supplies the starting main size before free space is distributed. Grow participates when the line has extra room; shrink participates when the starting sizes do not fit. The factors are proportions, not pixels, and their effect depends on the other items on the same line.
Allocate positive free space
If two items start at 200px and the line has 300px left, grow values 1 and 2 divide that remainder into one and two shares: 100px and 200px. Their resulting main sizes become about 300px and 400px before other constraints. A zero grow factor keeps an item out of this positive-space division. Percentage basis is relative to the container’s inner main size; auto uses the applicable size or content contribution and therefore deserves a real-content check.
Treat shrink as negotiation, not subtraction
Negative free space is weighted by both flex-shrink and the flex base size, so equal shrink factors do not always remove equal pixels from differently sized items. Content-based minimum sizes can also stop shrinking and cause overflow. FlexWeave intentionally emits only the flex shorthand: add min-width: 0 or another deliberate constraint in the real component only after inspecting long words, images, controls and zoom. Setting shrink to zero can preserve one item but transfers pressure to its siblings.
Verify the owning component
FlexWeave renders the validated visual model with the current browser, but it does not know your content, writing mode, focusable controls or supported viewport range. Paste the generated rules into the owning component, keep the source HTML in a meaningful order, and test narrow widths, zoom, long translations, keyboard navigation and assistive technology. Reverse direction and order never prove a correct reading sequence. Keep accepted CSS and HTML in source control because the capsule deliberately stores no project state.