ZStack

Usage

ZStack allows you to stack things along the Z-axis.

import { __experimentalZStack as ZStack } from '@wordpress/components';

function Example() {
    return (
        <ZStack offset={ 20 } isLayered>
            <ExampleImage />
            <ExampleImage />
            <ExampleImage />
        </ZStack>
    );
}

Props

isLayered: boolean

Layers children elements on top of each other (first: highest z-index, last: lowest z-index).

• Required: No
• Default: true

isReversed: boolean

Reverse the layer ordering (first: lowest z-index, last: highest z-index).

• Required: No
• Default: false

offset: number

The amount of space between each child element. Its value is automatically inverted (i.e. from positive to negative, and viceversa) when switching from LTR to RTL.

• Required: No
• Default: 0

children: ReactNode

The children to stack.

• Required: Yes