html - Getting content to clear a responsive image -


i have responsive image outside of body in code below. fills top half of screen , responsive, great, want of content underneath stay underneath image resizes nothing working - rather clear image sits on top of it. ideas or alternative methods try?

the html:

</head> <img src="/portfolio/images/me.jpg" class="ri"> <body>     <header>         <div class="contain">             <a href="/"><img src="/portfolio/images/logo.png" alt="logo" width="200" height="200"></a>         </div>     </header>         <div class="contain">             <nav>                 <ul>                     <li><a href="/contact">contact</a></li>                     <li><a href="/work">work</a></li>                     <li><a href="/details">details</a></li>                 </ul>             </nav>         </div> 

the css:

    .contain {     width: 980px;     margin: 0 auto; }  img.ri {     position: absolute;     max-width: 100%;     min-width: 980px;     top: 0%;     left: 0%;     border-radius: 1px;     box-shadow: 0 3px 6px rgba(0,0,0,0.9);     z-index: -200;  }          body {      .lift {     height: 80px;     }      header { 

this wanted if used floats rather position absolute; image should not outside off body really.

see http://jsfiddle.net/bncqp/ example

code

.contain {     width: 980px;     margin: 0 auto;     float:left; }  img.ri {     float:left;     max-width: 100%;     min-width: 980px;     top: 0%;     left: 0%;     border-radius: 1px;     box-shadow: 0 3px 6px rgba(0,0,0,0.9);     z-index: -200;  } 

Comments

Popular posts from this blog

linux - Does gcc have any options to add version info in ELF binary file? -

android - send complex objects as post php java -

charts - What graph/dashboard product is facebook using in Dashboard: PUE & WUE -