css-box 100% in höhe des browserfensters anpassen
klickme
- css
hallo forum,
ich möchte eine css-box 100% der höhe des browserfensters anpassen.
in dieser box sind verschiedene andere mit bildern und text.
die hauptbox soll links und rechts einen gestichelten rand bekommen.
probleme:
obwohl ich der hauptbox auf 100% höhe geschaltet ist, wird sie in firefox nicht so angezeigt. die strichlinien ebenso.
woran kann das liegen?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="de">
<head>
<meta http-equiv="Content-Language" content="de" />
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<style type="text/css" media="screen"><!--
html, body { margin: 0; padding: 0; height: 100% }
#main_box { background-color: #ebee02; background-position: left bottom; margin: 0 auto; position: relative; width: 700px; height: 100%; border-right: 1px dashed black; border-left: 1px dashed black }
#inhalte { background-color: #f0f; margin-right: auto; margin-left: auto; position: relative; z-index: 0; width: 790px; float: left }
--></style>
</head>
<body >
<div id="main_box">
<!-- KOPF -->
test
<!-- INHALTE -->
<div id="inhalte">
test
<br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</div></div>
</body>
</html>
Hallo,
gib der Box mal nicht height: 100%; sondern min-height: 100%;
(bei html und body aber height: 100%; stehen lassen).
Gruß,
Sebastian