Backdrop

A backdrop is a screen that covers the main content of a page when a modal is opened, to prevent page interaction until the modal is dismissed.

Examples

This component puts a backdrop over the entire viewport.

Class	Applied to	Outcome
`.pf-v6-c-backdrop`	`<div>`	Initiates backdrop. Required
`.pf-v6-c-backdrop__open`	`<body>`	Lock scrolling when backdrop is active. This class should be set on `<body>` while backdrop is active and removed while backdrop is inactive. Required