nicht angemeldet
Hallo,
ich hab mir folgendes Beispiel aus dem Selfhtml-Weblog
angeschaut und auf folgenden Auszug reduziert:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<title>Test</title>
<style type="text/css">
body {
color:black;
background-color:white;
}
#container {
border:1px solid red;
background-color:#CCCCCC;
}
p {
margin:0 0 0.5em 0;
}
.links-laenger {
display:block;
}
#innen2-links {
float:left;
width:50%;
border-bottom:1px solid green;
padding:0.5em 0 0 0;
background-color:#EFEFEF;
}
#innen2-rechts {
border:4px solid blue;
padding:0.5em 0 0 0;
margin-left:50%;
background-color:#BBBBFF;
}
#innen2-rechts:after {
content:"clear";
clear:both;
display:block;
height:0;
overflow:hidden;
visibility:hidden;
}
</style>
</head>
<body class="links-laenger">
<div id="container">
<div id="innen2-links">
<p>Nam tincidunt leo ac risus hendrerit ultricies. </p>
</div>
<div id="innen2-rechts">
<p>
Maecenas arcu risus, ultrices id, tincidunt feugiat, lacinia id, odio.
</p>
<p>
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.
Proin iaculis felis eget pede. Nunc vitae purus. Duis mi pede, rutrum eu, semper sed, ultricies nonummy, pede.
Mauris a dolor. Duis dui purus, adipiscing id, lacinia eget,
porttitor quis, diam. Cras vel diam. Sed rhoncus luctus felis.
Maecenas enim. Morbi quis dolor a justo aliquam condimentum.
</p>
</div>
</div>
</body>
</html>
Die rechte Spalte macht genau das, was ich wünsche: Sie ist so hoch, wie der Container, auch wenn weniger Inhalt da steht als in der linken Spalte. Dass das mit dem #innen2-rechts:after zusammenhängt, habe ich erkannt, was es genau mach nicht...
Außerdem hätte ich die Eigenschaften gerne vertauscht, sprich das die linke Spalte immer so hoch ist wie der Container, auch wenn weniger Text drin steht als in der rechten Spalte. Geht das? Und wenn ja: wie?
LG
Patty