Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<div class=transform>
  <dialog>
    Modal dialog
    <div class=fixed>
      Fixed pos element
    </div>
  </dialog>
  <div class=scroller></div>
</div>
<style>
  dialog {
    position:absolute;
    outline: 2px solid blue;
  }
  .fixed {
    position:fixed;
    border: 2px solid red;
    background: white;
    z-index: -1;
  }
  .transform {
    transform: translateZ(0);
  }
  .scroller {
     height:2000px;
  }
</style>
<script>
 document.querySelector('dialog').showModal();
</script>
Output

This bin was created anonymously and its free preview time has expired (learn why). — Get a free unrestricted account

Dismiss x
public
Bin info
anonymouspro
0viewers