CSS subset support

Subset version: 1.8.0

The Shell parses and computes the declarations below and the M6 Core consumes their canonical typed values. CSS text and selector matching remain outside Core.

Shorthands

Shorthands are expanded in the Shell and never reach the ABI.

Known deviations from CSS

Flex item automatic minimum size

min-width/min-height are auto initially, as CSS has them, and auto is the content-based minimum that keeps a flex item from being shrunk to nothing by a larger sibling. This subset answers it along the block axis only: a column flex container already measures every child's content height, so the floor costs nothing to know. Along the inline axis the content-based minimum is a leaf's longest unbreakable run, which needs a second text measurement this subset does not make, so a row's items may still be shrunk to zero; state min-width explicitly where that matters. A scroll container's automatic minimum is zero on the axis it scrolls, and it contributes nothing to an ancestor's minimum there either -- otherwise a virtualised list holding ten thousand rows would make every ancestor unshrinkable. Both properties reject negative lengths, which CSS does not accept either.

flex: <number> uses a 0px basis

CSS expands flex: 1 to 1 1 0%. This subset expands it to 1 1 0px. A 0% basis is indefinite when the container's main size is indefinite, whereas 0px is always definite; both resolve to the same number inside a definite container.

Percentage lengths in an indefinite axis resolve to zero

CSS treats a percentage against an indefinite containing block as auto. This subset resolves it to 0. The container's own content box is used whenever it is definite, including inside overflow: hidden/auto/scroll containers and along the block axis of column flow.

Percentage margins use one inline basis for the whole frame

A child's percentage margins are resolved once by its parent, against the parent's available inline content box, and the same values are used for measuring and for placement.

flex-shrink does not apply along a scrollable main axis

When a flex container scrolls along its main axis, overflowing content becomes scroll extent instead of a space deficit, so items are not shrunk. Growing still applies when the line is shorter than the viewport.

box-shadow is outer-only and paints under a transparent box

inset is rejected: drawing one needs an inverse path and a clip, and the shadcn preset has none. Canvas2D also paints the shadow behind the shape it came from, so a node with a transparent background shows the shadow through its middle where CSS would not; an opaque background covers it. Up to four shadows per node.

z-index reorders siblings, not stacking contexts

A z-index lifts or lowers a child within its own siblings, stably, so equal values keep document order. There are no stacking contexts: opacity and transform do not create one, and a z-index never escapes its parent. Accessibility order is deliberately unaffected, because a screen reader follows document order rather than what is drawn on top.

An absolutely positioned child is placed against its parent

CSS uses the nearest positioned ancestor as the containing block. This subset uses the parent's padding box, so every element is a containing block for its own absolutely positioned children and such a child must be a direct child of the box it is placed against. position: relative therefore has nothing left to mean and is not in the subset; use transform for a visual offset. With both left and right given, left wins and right is ignored; with neither, the child sits at the content-box origin rather than at its static position.

No flex-wrap

Flex containers are single-line. flex-wrap is not part of the subset, so main-axis overflow is clipped or scrolled rather than wrapped.