A full-bleed band with almost nothing in it. Down the middle runs a ribbon 34rem wide holding four portrait frames, one under another, each ruled off from the one above by a hairline and captioned with a tracked title and a single short line. Above them sits a small label and one line of intent. Everything else is air. Every word a visitor reads sits on the band's own ground; nothing sits on a photograph.
The signature moment
The gallery refuses the page's width
Every other gallery in this library spends the full 1240px measure it is given. This one takes 34rem of it and leaves the rest as air on both sides, so on a wide screen the section is a narrow ribbon of pictures with a great deal of nothing around it. That restraint is the design, and it is the reason the pattern reads as a photo essay rather than a grid: a single column of portraits at a reading measure is how a magazine sets pictures that are meant to be looked at in order, and a grid is how a site sets pictures that are meant to be scanned.
It survives colourlessness because the device is measure and emptiness. There is no wash, no tint and no accent anywhere in it; the only marks are currentColor hairlines and the type itself. Take every colour away and the ribbon is still narrow and the band is still empty, which is the whole argument. Invert the band, as the variation does, and the argument is untouched.
What happens at 390px. Nothing. The 34rem measure is already wider than a phone, so the ribbon simply becomes the full width of the band and the pattern looks the way it was designed to look all along: one column of portrait frames, each ruled off and captioned, read top to bottom. This is the only gallery in the set whose composition is UNCHANGED by the stack, and it is unchanged for the same reason it is unusual on a desktop. There is no core/columns anywhere in the pattern, so there is nothing for core's 782px breakpoint to restack.
What it inherits, what it decides
Inherits: every colour (the band is a base chain with contrast type; the variation is the inverse; the hairlines are currentColor), the typeface, and the spacing scale (spacing|80 above and below the band, spacing|50 between the intro and the first entry and between entries, spacing|40 between a hairline and the frame under it, spacing|30 between a frame and its caption, spacing|20 inside the intro).
Decides: the 34rem measure, which is the pattern; the 1240px band the ribbon sits inside and the clamp(1.25rem, 4vw, 4rem) gutters that keep it off the viewport edge on a phone; the 4:5 portrait crop on all four frames, set with aspectRatio and "scale":"cover" so the buyer's uploads are cropped to the proportion rather than setting it; the proportion of the type, a 13px tracked caps title against a 15px to 17px line at 1.55; and the hairline above every entry including the first, so the ribbon opens with a rule under the intro rather than drifting into the pictures.
The mechanic, and the one that was refused187 words
The narrow measure is held by a nested constrained group: the outer align: full band is {"layout":{"type":"constrained","contentSize":"1240px"}}, and its single child is a core/group with {"layout":{"type":"constrained","contentSize":"34rem"}}. No justifyContent, so the layout's own margin-inline: auto centres it in the band.
It is NOT held with padding-right: max(0rem, 100% - 34rem). That was measured: content-columns shipped it on a direct child of a constrained band, and nothing caught it while the block sat 144px out of line at 1400px, because the block is content-box and the padding therefore sits outside the layout's max-width. The block grows to the band's full width and centring puts its left edge at the band's padding edge. What gets measured is a width, and the width was right; the position was not.
The hairlines are per-side top borders on each entry group (border.top, currentColor, solid, 1px), never core/separator, which Twenty Twenty-Four narrows to a centred stub unless it carries is-style-wide. currentColor cannot blank, needs no chain, and follows whatever text colour the band carries, so the rule is exactly as dark as the caption beside it in both the base and the inverted variation.
What a buyer changes first155 words
The photographs. All four image blocks ship EMPTY, which is what WordPress's own save() writes before a file is chosen and is valid at both matrix entries: click each frame, choose from the media library, and the 4:5 crop is already set. Portraits suit it; a landscape upload will be cropped hard to the ribbon's proportion, which is the point of scale: cover.
The captions are the second thing. Each title is caps with 0.2em tracking and reads best under about 30 characters, and each line should be long enough to wrap once at 34rem so the entry has two lines of caption under its frame.
The measure is the third thing, and it is one number: the inner group's contentSize. Widening it past about 40rem loses the signature, because the air on either side is the design; narrowing it below about 28rem starts to crop the captions into columns of three or four words.
Variations66 words
- Ink proofs: the band inverts,
contrastground andbasetype throughout, including every caption title. The ribbon, its 34rem measure, its four frames and its hairlines are identical to the base; only the colour relationship changes, so the strip reads as a set of prints laid on a dark table. The hairlines need no edit, becausecurrentColorfollows the type into the inversion by itself.
The markup
Core block markup and nothing else. Copy it, then paste it straight into the block editor: WordPress reads the delimiters and rebuilds the blocks.
Fetching the markup…Variation: Ink proofs
Fetching the markup…