html - Div in front of another div -


i need move container of site in front of div background. how should looks like(ignore other elements, notice background , container) - http://prntscr.com/7bfurw

and how looks (wrong): enter image description here

i trying "position: absolute" , "top: x" , "little works" when used magnifier in browser, scattered.

this actual code... html:

<div class="horni-panel">     <div class="logo">         zhlednuto.cz     </div>      <div class="menu">         home, atd.     </div>  </div>  <!-- mini pozadi --> <div class="minipozadi">     ahoj </div>  <!-- hlavni obsah --> <div class="container"> ahooj </div> 

and css:

@font-face {     font-family: lato-bold;     src: url(fonts/lato-bold.ttf); }  body {     background-color: #34495e; }  .horni-panel {     border-top: 8px solid #34495e;     position:absolute;     top:0;     left:0;     right:0;     height: 77px;     width: 100%;     background-color: #ffffff; }  .logo {     color: #34495e;     font-family: lato-bold;     font-size: 33px; }  .minipozadi {     height: 282px;     width: 100%;     background-image: url(img/bg.jpg);     background-size: 100%;     background-repeat: no-repeat;     margin: 0 auto;     position:absolute;     top: 85px;     left:0;     right:0; }  .container {      z-index: -1;     margin: 0 auto;     top:0;     right:0;     left:0;     width: 70%;     height: 500px;     background-color: #ffffff;     border-radius: 5px; } 

i'm suspecting looking

http://output.jsbin.com/puladizire/2/

.minipozadi {     height: 282px;     width: 100%;     background:url(http://www.hdwallpapers.in/walls/abstract_color_background_picture_8016-wide.jpg);     background-size: 100%;     background-repeat: no-repeat;     margin: 0 auto;     position:absolute;     top: 85px;     left:0;     right:0;   z-index:1;   text-align:center;   font-size:30px; }  .container {      z-index: 100;     margin: 0 auto;   position:absolute;     top:0;     right:0;     left:0;   margin-top:200px;     width: 70%;     height: 400px;     background-color: #ffffff;     border-radius: 5px; } 

i have added margin , z-index container


Comments

Popular posts from this blog

angularjs - ADAL JS Angular- WebAPI add a new role claim to the token -

php - CakePHP HttpSockets send array of paramms -

node.js - Using Node without global install -