title: Difference between elevation and z-index in material-ui?
body: <p>I was going through the documentation of material-ui. It's <strong>documentation</strong> says:</p>
  
  <blockquote>
    <p>Several Material-UI components utilize z-index, the CSS property that
    helps control layout by providing a third axis to arrange content. We
    utilize a default z-index scale in Material-UI that's been designed to
    properly layer drawers, modals, snackbars, tooltips, and more.</p>
  </blockquote>
  
  <p><em>I want to make a component such that on button click, it pops on the top of another component and disappears after a task is finished.</em> <br><br>
  <strong>My question is should I use elevation property by wrapping up the popper component in a paper component or should I use z-index? What is the difference in the usage of elevation and zIndex in material-ui, as material-ui itself uses zIndex for the styling on third axis?</strong></p>