# Feature image sidelap

> A tall, generous photograph meets an opaque inverted text panel that overlaps its side, with a large heading and a compact feature line.

Canonical: https://patternpaste.com/pattern/feature-image-sidelap.html
Section: Features
Access: Included in Pattern Paste access.
Needs: Requires a block theme on WordPress 6.7 to 7.0. Classic themes and page builders are outside our supported setup. Adaptive patterns use the block theme’s colour, spacing and typography presets; styled variations declare their own colours or type.
Blocks: column, columns, group, heading, image, paragraph
Keywords: features, image, overlap, photography

Promise: Identical markup in every theme.

---

## The signature moment: large image with text overlapping its side

The photograph owns 58% of the band. An inverted panel crosses its right edge by up to 5rem. Below the core columns breakpoint the panel follows the image at full width and the horizontal overlap becomes zero.

## What to change first

1. Replace the portrait photograph.
2. Rewrite the display heading and supporting paragraph.
3. Replace the compact feature line with three real benefits.

## What it inherits from your theme

Typefaces, heading leading, the medium body-text size, spacing rhythm, and button shape and colours come from the theme. Base and contrast chains end in WordPress's guaranteed white and black presets. Eyebrows use the optional label role before falling back to contrast.

## What it decides for itself

The photograph's crop, the overlap, a 1240px outer measure, fluid side padding and the text panel's reading measure. All visible copy sits on opaque base or contrast panels. Photographs are reviewed CC0 images from the WordPress Photo Directory and travel with the copied pattern.

## Display type

The heading is display type, a bare clamp composed against the large image. The short feature line is a tracked label. Body paragraphs follow the medium ladder with a 1.6 line-height; uppercase labels use a fluid 15–16px size. Headings state their own ink colour and inherit their face and leading.

## Responsive behaviour

The photograph owns 58% of the band. An inverted panel crosses its right edge by up to 5rem. Below the core columns breakpoint the panel follows the image at full width and the horizontal overlap becomes zero. The section has fluid horizontal padding and no fixed height. Check long replacement headings at 390px as well as desktop.

## Contrast

Copy targets 4.5:1; large display headings target 3:1. Opaque panels keep image detail out of the text background. The verification sheet measures all three authoring themes.

## Blocks and editing

Core blocks only; no companion plugin, custom CSS or script is required. Replace the photos through the Image block and update their alt text. Set real destinations on the action links before publishing.
