SVG: display

display: none

The red square carries display: none (here from a class rule) and so does the red circle's group. Only the blue squares paint; a hidden element renders nothing, and nothing under it does either.

display: contents

Left: a group with transform, opacity and a fill. Right: the same group with display: contents, which has no box, so it is neither moved nor faded; the green fill it passes down by inheritance still reaches the square.

Text content children

A tspan with display: none leaves the text; a tspan with display: contents keeps its characters, in their own fill, without its own position.

alpha hidden beta kept