...

View Full Version : background image from top to bottom ?



docock
09-02-2011, 11:31 AM
I've got a small problem with a div. This div named 'contain' should display an image 'bg.jpg' in the full length of the html page. Instead it only displays the picture for only 70% of the pages length. With length I mean from the top to the bottom.

How can I alter my coding so that the image will be displayed along the full 100% of the div named 'contain' ?

Ps. I've excluded some plain text, otherwise the coding would be to large to show.



body{
height: 100%;
margin:0 auto;
text-align: center;
background:#fff;
font-family: 'American Typewriter', Georgia, sans-serif;
font-size: 17px;
}

.contain{
margin:0 auto;text-align:center;width:900px;min-height: 100%;
background-image: url('bg.jpg');
}




<div id="container">
<div class="contain">
<div style="text-align:left;width:300px;float:left;">
<div style="margin-top:42px;margin-left:50px;"><a href="http://www.devertaalsite.nl"><img src="logo.png" style="border:0px;" ></a></div>
<div class="leftcolumn">
<div style="width:210px;">


</div>
</div>
</div>

<div style="text-align:left;width:550px;float:left;">
<div style="margin-top:55px;margin-left:50px;">



</div>
</div> <div style="clear:both;width:900px;">&nbsp;</div>
<div class="footer" >&copy; 2011</div> </div>
</div>

teedoff
09-02-2011, 05:30 PM
Probably going to need to show all your html and css code. If you have a live link to your site, that would be better.

What does the image look like? Can it be repeated?

vikram1vicky
09-02-2011, 07:12 PM
Add following code in ur current CSS and try


html {
height:100%;
}
.contain {
min-height:100%;
height:auto !important;
height:100%;
}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum