Minimal Photographer Portfolio Features Layout for Divi 5: Three Zigzag Rows

This section is built around a single editorial gesture: alternate a photograph and a block of text three times, letting each pairing breathe at its own pace. The layout opens with a full-width centered header — an uppercase eyebrow label in Source Sans 3 at 14 px, a Playfair Display h2 at 44 px constrained to 720 px for a tight, typographic silhouette, and a one-line subtitle capped at 640 px — before dropping into the first of three 50/50 rows. On desktop each row locks to alignItems: center, so the image and the text block always sit at the same vertical midpoint regardless of which side is taller. The section sits on a warm cream #faf7f2 background throughout, and the two-color palette — near-black #1c1a17 for headings and underlined CTAs, stone #6b645a for eyebrow labels, body copy, and numbered counters — keeps the whole section quiet without feeling cold.

Every feature block follows the same four-part hierarchy: a small-caps numbered h4 (01, 02, 03) in Source Sans 3 at 13 px with 2 px letter-spacing acts as a visual index rather than a decorative flourish; a Playfair Display h3 at 32 px carries the feature name at a weight that reads clearly without competing with the intro h2; a short paragraph in Source Sans 3 at 18 px with 1.6 line-height gives the reader room; and a bare underlined text link closes each block with a low-pressure CTA. The text columns hold a maxWidth of 520 px and carry 48 px of right or left padding on desktop (24 px on tablet) to create genuine white space between the image edge and the first letter.

The zigzag rhythm reverses image and text position between rows one and three (image left) and row two (image right, text left), with one important mobile detail baked in: row two's image column carries order: -1 on phone, which pulls it above the text regardless of DOM order, so all three rows present image-then-text when stacked. Images are locked to a 4:3 aspect ratio with objectFit: cover, so swapping in portrait or landscape photography will not break the grid — the frame simply recrops. Section padding scales from 120 px at desktop to 80 px on tablet and 56 px on phone, keeping the generous breathing room proportional across breakpoints.