Hallo,
also als erstes das ist mein erster Versuch mit CSS ein Design zu programmieren.
Jetzt habe ich folgendes Problem:
Die Seite sollte 800px breit sein und sich selbst zentrieren.
Zentrieren funktioniert bis auf das das unten immer der Scrollbalken kommt und ich nicht weis woher.
Hier mein Code (CSS):
HTML:
Fals jemand jetzt sagt lerne Grundlagen, das mach ich gerade mach das auch mit Hilfe von einem Buch aber hier komme ich einfach nicht drauf auch nicht mit Google oder Suchen.
mfg
also als erstes das ist mein erster Versuch mit CSS ein Design zu programmieren.
Jetzt habe ich folgendes Problem:
Die Seite sollte 800px breit sein und sich selbst zentrieren.
Zentrieren funktioniert bis auf das das unten immer der Scrollbalken kommt und ich nicht weis woher.
Hier mein Code (CSS):
Code:
body {
font-size: 10px;
font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
color:#564b47;
background:#649164 url(bilder/verlauf2.png) 0% 0% repeat-x;
}
a {color: #DB7093;}
a:visited {color:#564b47;}
a:hover {color: #564b47;}
a:active { color:#564b47;}
h1 {
font-size: 11px;
padding: 5px 15px;
margin: 0px
}
h2 {
font-size:20px;
font-weight: normal;
padding: 5px 10px;
margin:0px;
}
#container {
width: 800px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
}
#banner {
text-align: right;
padding: 0px;
margin: 0px;
}
#banner img {padding:8px 0px;}
#navi {
height: 30px;
width: 100%;
float: left;
font-family: Verdana ,Arial,sans-serif;
font-size: 12px;
font-weight: bold;
}
ul#tab {
float: left;
position: relative;
left: 50%;
margin: 0 auto;
padding: 0;
list-style-type: none;
}
ul#tab li {
float: left;
position: relative;
right: 50%;
margin: 0 0 0 2px;
}
ul#tab li a {
display: block;
padding:8px 10px;
color: #fff;
border-radius: 7px 7px 0px 0px;
-moz-border-radius: 7px 7px 0px 0px;
-webkit-border-radius: 7px 7px 0px 0px;
text-decoration:none;
background-color: #b0cfb0;
}
ul#tab li.active a,
ul#tab li a:hover {
background-color: #FFFFFF;
color: #000000;
}
#content {
margin-top: 30px;
background-color: #b0cfb0;
padding: 0px;
}
div#content {
min-height:350px;
height:expression(this.scrollHeight > 600 ? "auto":"600px");
}
p, pre{
padding: 5px 10px;
margin:0px;
}HTML:
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><link type="text/css" href="css.css" rel="stylesheet" media="screen" /><title></title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head><body>
<div id="container"> <div id="banner" ><img src="bilder/banner.png" /></a></div> <div id="navi"> <ul id="tab"> <li><a href="#">HOME</a></li> <li><a href="#">CHRONIK</a></li> <li><a href="#">BERICHTE</a></li> <li><a href="#">TERMINE</a></li> <li><a href="#">MITGLIEDER</a></li> <li><a href="#">GÄSTEBUCH</a></li> <li><a href="#">KONTAKT</a></li> <li><a href="#">MEMBER</a></li> </ul> </div>
<div id="content"></div>
</div>
</body></html>Fals jemand jetzt sagt lerne Grundlagen, das mach ich gerade mach das auch mit Hilfe von einem Buch aber hier komme ich einfach nicht drauf auch nicht mit Google oder Suchen.
mfg
Zuletzt bearbeitet:
