Safe space - CSS Component ​

Playground ​

Customization ​

Construction ​

The CSS component uses a div or an img tag depending if the Safe Space component has a background image or not.

safe-space

Size ​

The size can be customize with the --z-safe-space--size CSS token:

Image ​

safe-space

Browser support ​

Detected engine:  

  • Chromium

  • Webkit

  • Gecko

HTML Examples ​

CodeSandbox example ​