Matthias Göbels wrote:[color=blue]
> Hi There,
>
> I have a problem with an xhtml/css layout.
>
> I habe 3 divs:
>
> 1) Header (height: 20px)
> 2) Content(height: ...) *
> 3) Footer (height: 20px)
>
> The three div's are among each other. The content div should fill the
> page so that the footer is always at the bottom of the page.
>
> I tried this one here:
http://clients.frixxx.de/xhtml/test01.html
>
> This is kinda right but the scrolling should'nt be if the text is as
> short as in this content div.
>
> Maybe someone can help.
>
> Sorry for my bad english.
>
> cU M.Göbels[/color]
First, you don't need the body height, margin, or border entries. Ditto
for the html, body entries.
If you want the header and footer divs to be a fixed amount, then use
height: for those. Remove the content div height: entry and then the
content area will grow or shrink with the amount of information in it.
I use the body section for global text attributes and background color
other than the div colors. If the divs fill the entire area, the body
background will not be visible
body {
}
#header {
background:#f00;
height: 20px;
margin: 0;
padding: 0;
}
#content {
background:#0f0;
margin:0;
padding:0;
}
body>#content{height:auto;}
#footer {
background:#00f;
height: 20px;
margin: 0;
padding: 0;
}
Wayne
