i'm using page relative & absolute positioning , percentages. html & body set 100%, container div relative , interior divs absolute. background image i've set container div not filling page - why? in advance!
here's i've got:
<style type="text/css"> html, body { width:100%; height:100%;} .container { width:1000px; height:100%; background-image:url('background.jpg'); position: relative; margin-left:auto; margin-right:auto; } .header { width:1000px; height:300px; background-color:#ffffff; position: absolute; top:0px; left:0px; } .content { width: 680px; position:absolute; top: 350px; left: 310px; } .post { width: 630px; padding: 20px; padding-top: 50px; } .title { width: 650px; height: 20px; padding: 10px; position: absolute; left: -10px; top: 10px; } </style> <body> <div class="container"> <div class="header"> placeholder header image. <p><a href="index.html">home</a></p> </div> <div class="content"> <div class="post"> <div class="title">welcome</div> <img src="placeholder.jpg" alt="proposal photo" width="630" /> </div> </div> </div>
try this
.container { width:1000px; height:100%; background-image:url('background.jpg') no-repeat; position: relative; margin-left:auto; margin-right:auto; background-size:100% }
Comments
Post a Comment