background image from top to bottom ?

[docock]

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]

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]

Add following code in ur current CSS and try

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