954,595 Members — Technology Publication meets Social Media
Username:
Password:
Lost login information?
Have something to say? Contribute New Article Reply to this Article

problem fixing in auto height

Hello friends,
In my website am trying to set my body height as auto. But whenever I try to set auto for height it does not show any color or image that i have put for body section. Well for internet explorer it shows fine but for Firefox and chrome i am encountring same problem. If i define a certain height like height:700px; then it shows fine but the height is fix i want it auto as the content move on. Here is the code . Please find a solution :(
website : www.ancestortravels.com
For now i had fix a certain height for this site as height:700px;

Html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head> 
<title>test for ancestor body </title>
<link href="pinsite.css" type="text/css" rel="stylesheet" />

</head>

<body>
<div id="wholebody">

<!--left section --> <div class="lef">
This is a test page..
</div>

<!-- right section --> <div class="rig">
<?php include_once 'homeright.php';  ?>
</div>
                    
</div>

</body>
</html>

CSS code

#wholebody{ background:url(images/wholebody.gif) #f5f6f0 repeat-y top center; margin-left:1px; width:1024px; height:auto; }

.lef{width:780px; float:left;}
.rig{width:243px; float:right;}


Here i see that if i remove float then the height is fixed as auto works fine. but i need to float as right hand side is a bottons tab. Any help will be heartly appriciated..

brainfo
Junior Poster in Training
63 posts since Sep 2011
Reputation Points: 5
Solved Threads: 1
 

Since body height is automatically determined by the height of the browser window, you don't need that style - unless for body you're referring to the 'wholebody' div.
In that case, clear the left and right divs inside the 'wholebody' div and it should work just fine.

</div>
<div style="clear:both"></div>
</div>
</body>
</html>


What's happening - with the floats not cleared, then the wholebody container is defaulting to a 0 height in Firefox.

Dandello
Posting Whiz in Training
263 posts since May 2010
Reputation Points: 28
Solved Threads: 23
 

Thank you so much. It works fine at all now. :)

brainfo
Junior Poster in Training
63 posts since Sep 2011
Reputation Points: 5
Solved Threads: 1
 

This question has already been solved

Post: Markdown Syntax: Formatting Help
You