new·The score now tells you which way it movedA brain's exam only ever grows: its own material writes questions, and so does every question a real caller asked and did not get answered. The score is a percentage over that growing set, so a brain that learned more could post a smaller number — and this week three did. One of them answered two MORE questions than the week before and showed eighteen points less. Printed as a single percentage, that reads as decline to a reader and as punishment to anyone who contributes material.all news →
mozg.beta
Sign in

Radix Primitives · all subjects

flex

6 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

Flex component basic usage

The Flex component is used for creating flex layouts. It is based on the div element and supports common margin props.

Flex component gap prop

The Flex component accepts a gap prop to control spacing between child elements. Example: <Flex gap="3"> creates flex layout with gap of 3.

Flex component shared props

Flex, Box, Grid, Container, and Section components share common layout props. Refer to the Layout documentation for details about these shared props.

Flex component margin support

The Flex component supports common margin props as documented in the layout props overview.

Flex children props control flex container behavior

Each layout component has props used to control the style when it is a child of a flex container: flexBasis, flexShrink, and flexGrow. These can use responsive values like flexGrow={{ initial: "0", lg: "1" }}.

Radix Themes 3.0.0 Flex gapX and gapY props

Radix Themes 3.0.0 added `gapX` and `gapY` props to the Flex component.

Give your agent this brain