html - Elements of postion absolute shifts on browser resize -


when re-size browser elements position set absolute not changes according other elements. if place absolute divs inside relative black box not shown.

<div id="outer"></div> <div id="blackbox"></div> <div class="form"></div>   #outer{     width:1250px;     height:auto;     margin:auto;     position:relative; } #blackbox{     width:100%;     height:100%;     background:#000;     opacity:0.5;     position:absolute;     z-index:10;     left:0;     top:0; } .form{     width:500px;     height:350px;     z-index:20;     background:#fff;     position:absolute;     top:100;     left:400; } 

used this

<div id="outer"> <div class="blackbox"></div> <div class="form"></div>   </div> 

define parent div position relative , child div position absolute

live demo

more position


Comments

Popular posts from this blog

android - getbluetoothservice() called with no bluetoothmanagercallback -

sql - ASP.NET SqlDataSource, like on SelectCommand -

ios - Undefined symbols for architecture armv7: "_OBJC_CLASS_$_SSZipArchive" -