inner div height css
I have the container that have 100% height and its work great
I want the Client Content will be 80%
I want it to be li开发者_JAVA百科ke thisExample http://img545.imageshack.us/img545/2822/exmapler.png
Here is my page HTML and CSS
CSS
*
{
padding: 0;
margin: 0;
}
html, body
{
height: 100%;
}
#container
{
min-height: 99%;
border-color: #36A9E9;
border-width: thin;
border-style: solid;
width: 85%;
margin: 0 auto;
background-color: ThreeDFace;
}
* html #container
{
height: 100%;
}
#ClientContent
{
min-height: 80%;
border-color: #36A9E9;
border-width: thin;
border-style: solid;
width: 100%;
margin: 0 auto;
background-color: ThreeDFace;
}
HTML
<body>
<form id="container" runat="server">
<div id="ClientContent">
</div>
</form>
</body>
please suggest any idea?
This seems to work here
*
{
padding: 0;
margin: 0;
}
html, body
{
height: 100%;
}
#container
{
position: relative;
min-height: 99%;
border-color: #36A9E9;
border-width: thin;
border-style: solid;
width: 85%;
margin: 0 auto;
background-color: ThreeDFace;
}
* html #container
{
height: 100%;
}
#ClientContent
{
position: absolute;
height: 80%;
border-color: #36A9E9;
border-width: thin;
border-style: solid;
width: 99.6%;
margin: 0 auto;
background-color: ThreeDFace;
}
You only need to put the vertical align to top and it should be ok. Put it on the #ClientContent. I'm not sure if that is what really is missing. Try to add max-height:80% aswell. Like this:
#ClientContent
{
max-height:80%;
vertical-align:top;
min-height: 80%;
border-color: #36A9E9;
border-width: thin;
border-style: solid;
width: 100%;
margin: 0 auto;
background-color: ThreeDFace;
}
Add #Clientcontent {height:80%}
精彩评论