Ich hab da ein kleines Coding Problem, ich hab da eine ganze Seite in Div tags gemacht, es arbeitet eigentlich alles wudnerbar und sitzt auch richtig in IE und FF... ist schon ein großes wunder *gg*
Mein Problem liegt beim Footer... ich seh ihn einfach nicht, bzw ist er nicht an der stelle wo ich ihn haben möchte.
Hier die HTML
- Code: Alles auswählen
<body>
<center><div id="root">
<div id="head"></div>
<div id ="menu">
<div id="ueberuns"><a href="#"></a></div>
<div id="neuigkeiten"><a href="#"></a></div>
<div id="gb"><a href="#"></a></div>
<div id="fanartikel"><a href="#"></a></div>
<div id="sponsoren"><a href="#"></a></div>
<div id="stadion"></div>
</div>
<div id="abstand"></div>
<div id="inhalt">
<div id="leftmenu">Linkes Menü</div>
<div id="content">Inhalt</div>
<div id="rightmenu">Rechtes Menü</div>
<div id="footer">Footer</div>
</div>
</div>
</center>
</body>
und die CSS dazu
- Code: Alles auswählen
<style type="text/css">
body {
margin-top: 0px;
margin-left: 15px;
margin-right: 15px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
text-align: center;
}
#root {
width: 985px;
text-align:left;
}
#head {
background-image: url(images/header.png);
width: 985px;
height: 122px;
position:relative;
top: 0px;
left: 0px;
}
#menu {
width: 985px;
height: 79px;
position: relative;
background-color: #132F51;
}
#ueberuns a{
background-image: url(images/ueberuns.png);
width: 146px;
height: 79px;
top: 0px;
left:0px;
position: absolute;
}
#ueberuns a:hover{
background-image: url(images/ueberuns_h.png);
width: 146px;
height: 79px;
top: 0px;
left:0px;
position: absolute;
}
#neuigkeiten a{
background-image: url(images/neuigkeiten.png);
background-repeat: no-repeat;
width: 129px;
height: 79px;
top: 0px;
left: 146px;
position: absolute;
}
#neuigkeiten a:hover{
background-image: url(images/neuigkeiten_h.png);
background-repeat: no-repeat;
width: 129px;
height: 79px;
top: 0px;
left: 146px;
position: absolute;
}
#gb a{
background-image: url(images/gb.png);
background-repeat: no-repeat;
width: 129px;
height: 79px;
top: 0px;
left: 275px;
position: absolute;
}
#gb a:hover{
background-image: url(images/gb_h.png);
background-repeat: no-repeat;
width: 129px;
height: 79px;
top: 0px;
left: 275px;
position: absolute;
}
#fanartikel a{
background-image: url(images/fanartikel.png);
background-repeat: no-repeat;
width: 127px;
height: 79px;
top: 0px;
left: 401px;
position: absolute;
}
#fanartikel a:hover{
background-image: url(images/fanartikel_h.png);
background-repeat: no-repeat;
width: 127px;
height: 79px;
top: 0px;
left: 401px;
position: absolute;
}
#sponsoren a{
background-image: url(images/sponsoren.png);
background-repeat: no-repeat;
width: 127px;
height: 79px;
top: 0px;
left: 528px;
position: absolute;
}
#sponsoren a:hover{
background-image: url(images/sponsoren_h.png);
background-repeat: no-repeat;
width: 127px;
height: 79px;
top: 0px;
left: 528px;
position: absolute;
}
#stadion {
background-image: url(images/stadion.png);
background-repeat: no-repeat;
width: 330px;
height: 79px;
top: 0px;
left: 655px;
position: absolute;
}
#abstand {
background-image: url(images/abstand.png);
background-repeat:no-repeat;
width: 985px;
height: 28px;
}
#inhalt {
width: 985px;
height: auto;
position: absolute;
}
#leftmenu {
width: 188px;
height: 200px auto;
background-color: #132F51;
left: 0px;
top: 0px;
position: absolute;
min-height: 400px;
color: #FFFFFF;
font-size: 10px;
padding-top: 10px;
padding-bottom: 10px;
float: left;
}
#content {
background-color:#FFFFFF;
width: 608px;
height: 5auto;
left: 188px;
top: 0px;
position: absolute;
padding: 10px;
min-height: 400px;
float: left;
}
#rightmenu {
background-color: #132F51;
width: 170px;
height: auto;
left: 815px;
top: 0px;
position: absolute;
min-height: 400px;
color: #FFFFFF;
font-size: 10px;
padding-top: 10px;
padding-bottom: 10px;
float: right;
}
#footer {
background-color: #132F51;
width: 985px;
height: 15px;
color: #FFFFFF;
font-size: 10px;
text-align: center;
}
</style>
wie muss ich das machen damit es geht?
Hier zu betrachten