how2ice/react-test
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity
Files
005cf56baf3daf42760077995d8618841d1def40
react-test/docs/data/material/customization/z-index/z-index.md
how2ice 005cf56baf
Some checks failed
No response / noResponse (push) Has been cancelled
Details
CI / Continuous releases (push) Has been cancelled
Details
CI / test-dev (macos-latest) (push) Has been cancelled
Details
CI / test-dev (ubuntu-latest) (push) Has been cancelled
Details
CI / test-dev (windows-latest) (push) Has been cancelled
Details
Maintenance / main (push) Has been cancelled
Details
Scorecards supply-chain security / Scorecards analysis (push) Has been cancelled
Details
CodeQL / Analyze (push) Has been cancelled
Details
init project
2025-12-12 14:26:25 +09:00

836 B
Raw Blame History

z-index

z-index is the CSS property that helps control layout by providing a third axis to arrange content.

Several Material UI components utilize z-index, employing a default z-index scale that has been designed to properly layer drawers, modals, snackbars, tooltips, and more.

The z-index values start at an arbitrary number, high and specific enough to ideally avoid conflicts:

  • mobile stepper: 1000
  • fab: 1050
  • speed dial: 1050
  • app bar: 1100
  • drawer: 1200
  • modal: 1300
  • snackbar: 1400
  • tooltip: 1500

These values can always be customized. You will find them in the theme under the zIndex key of the theme. Customization of individual values is discouraged; should you change one, you likely need to change them all.