So ich habe jetzt ein festes Layout genommen von ungefähr 800 Pixeln Breite. Leider habe ich Probleme mit den drei Boxen am unterem Rand. Ich bekomme sie nicht zentriert und auf die richtige Breite.
http://www.michael-puff.de/Privat/Dev/XPUsermanager/
Mein Stylesheet:
Code:
/*
Bildschirm Stylesheet für xpusermanager.de
2011-01-20
*/
.navigation {
text-align: right;
margin-bottom: 20px;
padding: 5px;
background-color: lightblue;
border-left: 2px solid #818485;
border-right: 2px solid #818485;
border-bottom: 2px solid #818485;
}
body {
font-family: Arial, Sans-Serif;
font-size: 90%;
width: 840px;
margin-left: auto;
margin-right: auto;
background-color: #F8F8FC;
}
h1.title {
font-style: italic;
background-color: lightblue;
color: white;
margin: 0px;
padding: 5px;
border-left: 2px solid #818485;
border-right: 2px solid #818485;
border-top: 2px solid #818485;
}
h1 {
padding: 0px;
}
h2, h3 {
padding: 0px;
}
p {
padding: 0px;
}
font.em {
font-weight: 600;
}
.navigation a {
color: black;
font-weight: bold;
}
div.body {
text-align: justify;
width: 800px;
padding: 20px;
margin-left:auto;
margin-right:auto;
background-color: #E8E8E8;
}
div.bottom {
width: 800px;
margin-left:auto;
margin-right:auto;
padding-top: 5px;
}
div.boxes {
float: left;
width: 200px;
padding: 20px;
margin: 5px;
background-color: #E8E8E8;
}
div.footer {
clear: both;
padding-top: 10px;
text-align: right;
font-size: small;
}
div.hintbuy {
text-align: right;
font-weight: bold;
}
div.downloadlink {
text-align: center;
font-weight: bold;
}
table {
border-collapse: collapse;
border-width: 2px;
border-style: solid;
border-color: gray;
font-size: 90%;
}
th {
text-align: left;
border-width: 1px;
border-style: solid;
padding: 3px;
font-weight: bold;
}
td {
padding: 3px;
border-width: 1px;
border-style: solid;
}
Und wem ein besseres Farbschema einfällt..nur her damit. Denn damit bin ich auch noch nicht zufrieden.
Ach so, warum ist das Padding oben und unten in der großen Box größer als am Rand? Das Padding von den Überschriften habe ich doch auf null gesetzt?