Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<meta name="description" content="[Overlaying divs on iOS]" />
<div>
    <div class="page fixed one"></div>
    <div class="page fixed two"></div>
    <div class="page "></div>
    <div class="page z"></div>
    <div class="page"></div>
</div>
 
.page {
    width:50%;
    height:200%;
    border:2px solid #000;
    background-color:#ccc;
   
    -webkit-transform:translateZ(1px);
    -moz-transform:translateZ(1px);
    -o-transform:translateZ(1px);
    transform:translateZ(1px);
    position: relative; 
    z-index: 1; 
}
.page.z {
    border-color:#F00;
    height:200px;
    -webkit-transform:translateZ(3px);
    -moz-transform:translateZ(3px);
    -o-transform:translateZ(3px);
    transform:translateZ(3px);
    z-index: 3; 
    
}
.page.fixed {
    width:10%;
    top:50px;
    height: 50px; 
    
    position: fixed;
}
.page.fixed.one {
    left:5%;
    background-color:#0cc;
    
    -webkit-transform:translateZ(2px);
    -moz-transform:translateZ(2px);
    -o-transform:translateZ(2px);
    transform:translateZ(2px);    
    z-index: 2; 
}
.page.fixed.two {
    left:25%;
    background-color:#Fcc;
    
    -webkit-transform:translateZ(4px);
    -moz-transform:translateZ(4px);
    -o-transform:translateZ(4px);
    transform:translateZ(4px);
    z-index: 4;
}
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
amicoleopro
0viewers