Hallo,
ich habe ein Layout das ihr dem angehängten Code entnehmen könnt (verzeiht die Länge, ich habe noch keine Möglichkeit das online zu stellen).
Das Problem ist, dass sich der inhaltsbereich je nach Inhaltsumfang nach unten ausdehnen soll, jedoch soll eine gewisse Mindestgröße erhalten bleiben wenn wenig Inhalt angezeigt wird. Der IE macht das mit diesem Code, der Firefox nicht.
Ich habe schon an den Höhenangaben (auto/feste Angaben) in #inhalt und #contents gespielt und es mit min-height versucht. Alles ohne Erfolg. Bin für jeden Tipp dankbar!!
Gruß,
Thomas
body
{
font: 85% arial, hevetica, sans-serif;
text-align: center;
color: #505367;
background-color: #D6D6D6;
}
#container
{
margin: 1em auto;
width: 850px;
text-align: left;
background-color: red;
border: 1px solid back;
positon: absolute;
}
#header
{
float:left;
height: 85px;
width:850px;
background-color: #900000;
}
#contents
{
margin-right: 0px;
margin-left: 0px;
height: auto;
width: 850px;
/*background-image: url(gelb.gif);*/
background-color:orange;
top:85px;
}
#mainnav
{
height: 20px;
width:200px;
float:right;
padding-right:10px;
color:orange;
background:url("lu.gif") bottom right no-repeat;
}
#menu
{
float: left;
width: 110px;
height: 340px;
background-color: #900000;
}
#inhalt
{
float:top;
margin-top:30px;
margin-left:120px;
width:720px;
text-align:center;
clear:right;
border:2px solid black;
height:470px;
}
#footer
{
clear: both;
height: 20px;
width:850px;
background-color: #900000;
color:orange;
}
</style>
</head>
<body>
<div id="container">
<div id="header">
</div>
<div id="contents">
<div id="mainnav">
</div>
<div id="menu" >
</div>
<div id="inhalt">
text<br>text<br>text<br>text<br>text<br>text<br>text<br>text
<br>text<br>text<br>text<br>text<br>text<br>text<br>text
<br>text<br>text<br>text<br>text<br>text<br>text<br>text
<br>text<br>text<br>text<br>text<br>text<br>text<br>text
<br>text<br>text<br>text<br>text<br>text<br>text<br>text
<br>text<br>text<br>text<br>text<br>text<br>text<br>text
<br>text<br>
</div>
</div>
<div id="footer"><div>
</div>
</body>
</html>