Hallo Heiko,
... ähem ... nochmal ich... vielleicht kannst Du mir nochmal helfen ...
? Ich wollte in die Box mit den 100% Höhe noch eine Box reinsetzen, die ebenfalls 100% Höhe hat und eine Border, die dann auch immer bis unten geht...
Habe diese zweite Box genauso angegeben wie die äussere mit min-height: 100% ... die innere geht jetzt aber trotzdem nicht bis ganz runter... (im folgenden Code ist nur das div #main_box dazugekommen)
Gruss,
Christine
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<title>Höhenproblem Firefox</title>
<style type="text/css">
html, body {
height: 100%;
margin: 0;
padding: 20px 0 0 0;
background-color: #E1E1E1;
}
* html body {
width: 100%;
text-align: center;
overflow: hidden;
}
div#page_box {
width: 788px;
min-height: 100%;
text-align: left;
margin: 0px auto 0px auto;
padding-top: 1px;
background-color: #00495A;
}
* html #page_box {
height: 100%;
}
div#main_box {
width: 770px;
min-height: 100%;
margin: 7px 8px 0 8px;
border-top: 1px solid #CCC;
border-left: 1px solid #CCC;
border-right: 1px solid #CCC;
}
* html div#main_box {
height: 100%;
}
#content {
width: 100%;
margin: 30px;
font-family: Verdana;
color: #FFF;
}
</style>
</head>
<body>
<div id="page_box">
<div id="main_box">
<div id="content">
Hier Content.
Das innere div mit dem grauen Rahmen soll ebenfalls immer bis ganz unten gehen...
Tut's im IE, aber nicht im Firefox...
</div>
</div>
</div>
</body>
</html>