Hello,
Currently, I have a code like this
<!DOCTYPE HTML PUBLIC "-// W3C//DTD HTML 4.01 Transitional//EN" " http://www.w3.org/TR/html4/loose.dtd">
<html><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
body {
background:#000;
}
#header{
float:right;
width:800px;
}
#topbar {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 30px;
}
#container-box{
margin:0px auto;
border:1px solid black;
width:950px;
margin-top:40px;
height:550px;
}
#image-box{
border:3px solid Black;
position:absolute;
float:left;
width:120px;
height:120px;
z-index:1000;
background:#000099;
}
#inside-box{
z-index:-100;
margin:0px auto;
border:1px solid #737373;
width:900px;
margin-top:50px;
height:100%;
}
#inside-left{
float:left;
border-right:1px solid #737373;
width:250px;
height:100%;
text-align:bottom;
}
#inside-right{
float:right;
width:649px;
color:#FFFFFF;
}
#right-top{
float:left;
width:649px;
height:375px;
border-bottom:1px solid #737373;
}
#right-btm{
float:left;
padding-top:5px;
width:649px;
height:150px;
}
#footer{
color:#c3c3c3;
}
#footer #footer_left{
float:left;
width:200px;
font-size:9px;
margin-top:5px;
margin-left:30px;
text-align:left;
}
#footer #footer_right{
float:right;
width:500px;
font-size:14px;
margin-right:30px;
margin-top:5px;
text-align:right;
}
#footer #footer_right .linkage{
float:right;
margin-right:20px;
}
#footer #footer_right .linkage a{
color:#c3c3c3;
text-decoration:none;
}
</style>
</head>
<div id="header">
<div id="topbar"></div>
</div>
<div id="container-box">
<div id="image-box"></div>
<div id="inside-box">
<div id="inside-left">
<table width="100%" cellspacing="15px" height="100%">
<tbody><tr valign="bottom">
<td>
<div class="elements"></div>
<div class="elements"></div>
</td>
</tr>
</tbody></table>
</div>
<div id="inside-right">The inner German border was the frontier between the German Democratic Republic (East Germany) and the Federal Republic of Germany (West Germany) from 1949 to 1990. Not including the similar but physically separate Berlin Wall, the border was 1,381 kilometres (858 mi) long and ran from the Baltic Sea to Czechoslovakia. It was formally established on 1 July 1945 as the boundary between the Western and Soviet occupation zones of Germany. On the Eastern side, it was made one of the world's most heavily fortified frontiers, defined by a continuous line of high metal fences and walls, barbed wire, alarms, trenches, watchtowers, automatic booby-traps and minefields. The border was a physical manifestation of Winston Churchill's metaphor of an Iron Curtain separating the Soviet and Western blocs during the Cold War. Built by East Germany in phases from 1952 to the late 1980s, the fortifications were constructed to stop the large-scale emigration of East German citizens to the West. It caused widespread economic and social disruption on both sides. On 9 November 1989, the East German government announced the opening of the Berlin Wall and the inner German border. The inner German border was not completely abandoned until 1 July 1990, exactly 45 years to the day since its establishment, and only three months before German reunification formally ended Germany's division. Little remains today of the inner German border's fortifications. The inner German border was the frontier between the German Democratic Republic (East Germany) and the Federal Republic of Germany (West Germany) from 1949 to 1990. Not including the similar but physically separate Berlin Wall, the border was 1,381 kilometres (858 mi) long and ran from the Baltic Sea to Czechoslovakia. It was formally established on 1 July 1945 as the boundary between the Western and Soviet occupation zones of Germany. On the Eastern side, it was made one of the world's most heavily fortified frontiers, defined by a continuous line of high metal fences and walls, barbed wire, alarms, trenches, watchtowers, automatic booby-traps and minefields. The border was a physical manifestation of Winston Churchill's metaphor of an Iron Curtain separating the Soviet and Western blocs during the Cold War. Built by East Germany in phases from 1952 to the late 1980s, the fortifications were constructed to stop the large-scale emigration of East German citizens to the West..</div>
</div>
</div>
</body>
</html>
The output is like this.
Currently, content is inside the box because it's not reach yet. But when content is exceed the height. It is going to be like this. Because i set the fixed height.
Please see this image
But when I change all the height as 100% height, it doesn't work. Output is changed like this
Can anyone help me to fix it ? Thanks much.
With Regards,