womstar
Lounge-Member
Hallo CSS'ler,
da in letzter Zeit öfters mal die Frage auf kam, wie man sein Content eine feste Höhe geben kann und dieser trotzdem sich dynamisch anpasst, wenn mehr text dazu kommt.
Ich biete die Lösung des Höhen-Halters an.
Dieser, bestehen aus einem <div>, ist dafür zuständig, dass die Höhe gehalten wird, wenn sich mal weniger als gewollte Text im Contentbereich befindet. Dieser ist unabhängig vom eigentlichem Contentbereich.
Also einfach mal angucken.
Grüße Robert
da in letzter Zeit öfters mal die Frage auf kam, wie man sein Content eine feste Höhe geben kann und dieser trotzdem sich dynamisch anpasst, wenn mehr text dazu kommt.
Ich biete die Lösung des Höhen-Halters an.
Dieser, bestehen aus einem <div>, ist dafür zuständig, dass die Höhe gehalten wird, wenn sich mal weniger als gewollte Text im Contentbereich befindet. Dieser ist unabhängig vom eigentlichem Contentbereich.
Also einfach mal angucken.
Grüße Robert
Code:
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head>
<title>/</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<style type="text/css">
body {
font : normal 0.8em Sans-Serif;
}
#content {
width : 551px;
background-color : #E8E8E8;
}
#heightholder {
line-height : 0px;
font-size : 1px;
width : 1px;
height : 400px;
float : left;
}
#leftcell {
text-align : justify;
line-height : 20px;
width : 180px;
padding : 10px;
float : left;
}
#rightcell {
text-align : justify;
line-height : 20px;
width : 330px;
padding : 10px;
float : left;
}
.clear {
line-height : 0px;
font-size : 1px;
clear : both;
}
</style>
</head>
<body>
<div id="content">
<div id="heightholder"></div>
<div id="leftcell">
<strong>Der Blindtext-Fall</strong>
<br />
Sie erinnern sich. Der Blindtext-Fall im vorigen Jahr. Nun will Karl noch nach Canossa. Und Claudia heiratet
zur Busse Copperfield. Jeden Morgen entzünden sie eine Kerze. Jeden Nachmittag ist eine Runde Rosenkranz fällig.
Zur Heiligen Marie. Weil Karl mit dem Zopf der Claudia mit dem Smile optisch nette Koran-Typo aufs Mieder hat
sticken lassen. Heiliger Blindtext am Busen.
</div>
<div id="rightcell">
Da läßt der Mullah nicht mit sich scherzen. Blindtext killt Chanel, Islam erklärt Karl den Krieg, das
Abendland zittert. Der Blindtext-Fall ist geboren. Die Geschichte des Blindtextes und seiner Texter wird
aufgeblättert. Endlich. Was wissen Sie über Blindtext? Katholischen nimmt man für Kochbücher,
evangelischen für Bauhausmöbelprospekte, hebräischer wird in Hollywood verfilmt, atheistischer ist für
Procter & Gamble Waschmittel, arabischer ist nicht. Und weiter? Zu wem beten Karl und Claudia jeden Tag
als Buße für ihre Blindtext-Sünde? Zu ihr. Zur Heiligen Marie Antoinette. Madame ging schön aufs Schafott.
Welch eine Haltung. Sie weiß, sie kriegt den Kopf ab. Aber vorher pudert sie ihn noch, beißt sich auf die
Lippen von wegen Lippenrot, kneift sich in die Wangen von wegen Wangenrot. Und sie weiß, sie wird den Kopf
verlieren. Oben ab. Und es stört die Marie nicht. Diese Haltung verehren die Blindtexter. Du weißt, du
wirst gecuttet. Aber du gibst alles. Sainte Marie, steh uns bei. The english call it the holy
attitude of SM.
Des Blindtexters Heiliges Tier ist das Schwein. Es atmet und furzt, frißt und säuft, um verwurstet zu
werden. Wie ähnlich doch dem Blindtext, der nur entsteht, um zerlegt zu werden. Was sagt der Art Director
zu Faust? ... denn alles, was entsteht, ist wert, daß es zugrunde geht ...
Lohnt es sich nun zu clustern, was beim Art Direktor hinten rauskommt?
</div>
<br class="clear" />
</div>
</body>
</html>