Kategorien
Joomla Templates

Joomla Template Reihe K22

Joomla Logo flat

Dieses Template besteht aus zwei Containern die mittels float positioniert werden.
Die CSS Deklarationen sehen wie folgt aus:

rahmen {
width:980px;
margin: auto;
text-align:left;
}
main {
float:left;
width:790px;
margin-top:10px;
text-align:left;
}
menue {
float:right;
clear:right;
margin:0;
padding:0;
text-align:center;
font-size:12px;
width:186px;
margin-top:10px;
background-color:#4D88FF;
color:#FFFFFF;
border-left:1px solid #E0E0E0;
min-height:400px;
}

Das header-Image ist 800x450px und wird über:

header {        
background:transparent url(../images/header.jpg) 0 0 no-repeat;
height:400px;
color:#FFFFCC;
border-bottom:3px solid #000000;
}

zugewiesen.

Warnhinweis – Diese Seiten benutzen bestimmte CSS-Definitionen, die von älteren Browsern nicht dargestellt werden können.

Getestet habe dieses Template mit SeaMonkey 1.1.2 und dem IE7 (7.0.6000.16448). Anpassungen für andere Browser sind nicht explzit enthalten und auch nicht geplant.

173 kB

Kategorien
Joomla Templates

Joomla Template – K06

Joomla Logo flat

Dieses Template baut auf DIV-Container auf, besitzt eine feste Breite von 920px.
Als primaeren Font verwende ich Trebuchet MS. Das Zentrieren des Layouts erfolgt mittels automatischer Ränder:

#container{width: 920px; margin:auto;}

Das funktioniert bei den meisten neueren Browsern, für den IE im Quirks-Modus sollte ein

body{text-align: center;} 

eingefügt werden.
Für den Netscape 6, um ein „Herauslaufen“ der Seite über den Rand zu verhindern, auch noch ein:

body{min-width: 800px;}

Die Eigenschaft „text-align“ kann dann im #container wieder angepasst werden.
Dieses Möglichkeit des Zentrierens verhindert das Verschieben bei geringen Breiten oder Auflösungen,
im Vergleich zu einer Zentrierung mit negativen Rändern.

Dieses Template ist getestet mit Firefox 2.0 und dem IE 6 bzw. 7.
Alle templatebezogenen Grafiken und Bilder sind selbst erstellt und bearbeitet.

102 kB