Dieses Template besteht aus einem #main Bereich von 800px. Die Zentrierung erfolgt über automatische Ränder. Der Contentbereich #content_aussen ist 480px breit. Darüber befindet sich noch das #topmenue. Als Doctype verwende ich xhtml-strict.
#main {
margin:0;
padding:0;
margin:0px auto;
text-align:left;
width:800px;
}
Das Mainmenue und der Contentbereich werden mittels float angeordnet. Der Contentbereich umfliesst das Mainmenue. (float:right;)
Dieses Template verwendet eine Breite von 800px für den #mainbereich mit einer Zentrierung mittels automatischer Ränder.
#main {
width: 800px;
margin: 2em auto;
border: 3px solid #FFFFFF;
background:#3576CB
url(../images/base.jpg)
0 0 no-repeat;
line-height:1em;
}
Die Grafik setzt sich aus drei Bildern zusammen, die entsprechend der Lage gegeneinander verschoben werden.
#main {
...
background:#3576CB
url(../images/base.jpg)
0 0 no-repeat;
...
}
.titel {
...
background:transparent
url(../images/fade.jpg)
-1.4em -1.25em no-repeat;
...
}
#content {
...
background:#FFEEDA
url(../images/wash.jpg)
-2em -4.6em no-repeat;
...
}
Dieses Template verwendet eine Breite von 950px der eigentliche Contentbereich ist 700px breit mit einem padding von 10px.
#gesamt {
width:950px;
margin:10px auto;
text-align:left;
}
#content {
float:right;
clear:right;
border:1px solid #CCCCCC;
border-right:1px solid #757575;
border-bottom:1px solid #757575;
width: 700px;
padding:0;
margin:0;
background-color: #A0C0E0;
color:#444444;
text-align:left;
}
Dieses Template verwendet eine fixe Breite von 650 px und wird zentriert dargestellt.
#main {
width: 650px;
margin: auto;
margin-top:5px;
text-align:center;
}