PDA

Click to See Complete Forum and Search --> : Increasing height of body div tag dynamically

vina789
December 7th, 2009, 11:36 PM
Hi
I am java developer but i am strucked with css application. Actually i am using tiles concept in my application in which layout page using css tags to specify positions of header,menu ,body,footers.In this project my body content is getting dynamically from database when the content is more my body page is coming out of the footer pls help how to solve this problem my increasing the class "container" height dynamically this is my layout page.

<html>
<head>
<link href="./css/<%=css%>.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="container">
<table border="0" cellspacing="0" cellpadding="0" style="width:100%;height:100%">

<tr>
<td colspan="2" height="130">
<tiles:insert attribute="header"/></td>
</tr>
<tr>
<td width="190">
<tiles:insert attribute="menu"/></td>
<td width="710">
<tiles:insert attribute="body"/></td>
</tr>
<tr>
<td colspan="2" height="30">
<tiles:insert attribute="footer"/></td>
</tr>

</table>

</div>

</body>
</html>
HanneSThEGreaT
December 8th, 2009, 09:01 AM
Have you tried using the height and width properties for the div, ie :
<div class="container" style="width:200 px;height:400 px">

Just an ad hoc example.
Xeel
December 8th, 2009, 04:15 PM
You can calculate body dimensions but you can't set them, or at least browsers will ignore these parameters. Do as HanneSThEGreaT suggested, create a wrapper div and set its height.
niladhar8@gmail.com
December 21st, 2009, 05:26 PM
Hi
I am java developer but i am strucked with css application. Actually i am using tiles concept in my application in which layout page using css tags to specify positions of header,menu ,body,footers.In this project my body content is getting dynamically from database when the content is more my body page is coming out of the footer pls help how to solve this problem my increasing the class "container" height dynamically this is my layout page.

<html>
<head>
<link href="./css/<%=css%>.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="container">
<table border="0" cellspacing="0" cellpadding="0" style="width:100%;height:100%">

<tr>
<td colspan="2" height="130">
<tiles:insert attribute="header"/></td>
</tr>
<tr>
<td width="190">
<tiles:insert attribute="menu"/></td>
<td width="710">
<tiles:insert attribute="body"/></td>
</tr>
<tr>
<td colspan="2" height="30">
<tiles:insert attribute="footer"/></td>
</tr>

</table>

</div>

</body>
</html>

what you could do is float your container div and inside that place your content div after the content div closes and before the closing of the container div, add a css class which has a style property of clear:both; this will solve your problem...
cheers.