Menue links

#left {
float: left;
width: 20em;
margin: 0;
padding:15px 0 0 0;
color:#ffffff;
}

Menu links hat eine dynamische breite in em. Textabstände sind in Pixel definiert. Die Hintergrundfarbe kommt vom container div.


monorom

Dynamisches Basic Template No.1.07

Creative Commons License This work is licensed under a Creative Commons License.
css template Dowload Template

2 Spalten linksbündig, dynamische Breite

Zweispaltiges Layoutraster. Beide Spalten haben eine dynamische Breite und wachsen in der Breite beim Vergrössern der Schrift.
Die Randabstände der Schrift ist der Einfachheit halber in Pixel angegeben.

Alle Templates validieren als XHTML 1.0 rsp. CSS2. Sie sind tableless und browserübergreifend einsetzbar.
Dieses Template wurde auf folgenden Browsern getestet:
MAC Safari, Opera 9.1, Mozilla, Firefox
PC: IE 6 und 7, Firefox
Linux: Konqueror, Firefox

Inhalt

#container {
width: 70em;
margin: 0;
padding: 0;
background-color: #564b47;
}

Der container-div gibt dem Layout die Breite, die dynamisch mit der Schrift skaliert. Die linke Spalte bezieht ihre Hintergrundfarbe vom container div.

#content {
float: left;
width: 50em;
min-height:600px;
background-color: #ffffff;
padding: 0;
margin: 0;
}

Der content div floatet links. Die Höhe ist mit min-height definiert, die der IE6 nicht darstellen kann. Lösungen zu diesem Problem findest Du in Templates/2/1.

#footer {
clear: left;
background-color: #ffffff;
padding: 0;
margin: 0;
margin-left: 20em;
}

Der footer hebt durch clear das float auf.

«-- zurück