Fusszeile
Thomas
- css
Hallo,
ich habe ein Problem mit einer Fusszeile im CSS.
Ich möchte eine Abschlussleiste quer über den Bildschirm machen, nur zeigt mir der IE6 sowie
Firefox die Leiste nicht am Boden, sondern irgendwo in der Seite an.
#schlusszeile { position: absolute; bottom: 0px; width: 100%; height:20px; text-align: center; color: #FFF; font-size: 11px; background-color: #F00;}
Was kann ich machen, das die Leiste "am Boden" bleibt?
mfg
Thomas
Moin
Ist der div #schlusszeile in einen anderen Div eingebettet oder direkt im Body?
Gruß Bobby
Das CSS:
html, body {
margin: 0px; padding: 0px; border: 0; height: 99%;
font-family: arial, times;
background: #FFFFFF url('../hintergrund/menue2b.gif') left repeat-y;
}
a img { border: 0px; }
a { font-family: arial, times; text-decoration: none; color: #FF0000; font-size: 13px; }
a.schwarz:link {
background-color: none;
color: #000000;
text-decoration: none;
font-size: 11px;
}
a.schwarz:visited {
background-color: none;
color: #000000;
text-decoration: none;
font-size: 11px;
}
a.schwarz:active {
background-color: none;
color: #000000;
text-decoration: none;
font-size: 11px;
}
a.schwarz:hover {
background-color: none;
color: #FF0000;
text-decoration: none;
font-size: 11px;
}
#banner { width: 100%; padding: 0px; background: transparent url('../hintergrund/banner5.gif') top repeat-x;}
#lieferanten { width: 393px; height: 14px; position: relative; bottom: 92px; right: 3px; }
#hauptseite { width: 100%; }
#links { float: left; padding-top: 40px; padding-left: 10px; width: 150px; }
#rechts { position: absolute; left: 150px; right: 0px; top: 96px; bottom: 15px; padding-left: 15px; padding-right: 15px; margin: 0px; padding: 0px; overflow: fixed; text-align: center; }
#textfeld { width: 720px; border: none; background-color: white; padding-top: 0px; padding-left: 20px; text-align: left; margin-left: auto; margin-right: auto; }
a.menue {
background-color: white;
display: block;
width: 115px;
border: 1px solid #555;
border-top: 4px solid #555;
font-size: 12px;
padding-left: 5px;
color: black;
text-decoration: none;
margin-top: -12px;
}
a.menue:hover {
border: 1px solid #000000;
border-top: 4px solid #CCCCCC;
}
a.menue_aktiv {
background-color: #CCCCCC;
display: block;
width: 115px;
border: 1px solid #555;
border-top: 4px solid #555;
font-size: 12px;
padding-left: 5px;
color: black;
text-decoration: none;
margin-top: -12px;
}
h1 { font-family: times, serif; width: 720px; border-bottom: 1px solid #777; font-weight: normal; color: #555; margin: 0; }
p { font-size: 13px; line-height: 18px; margin-top: 20px; margin-right: 10px; }
table, tr, td { border: 0px; margin: 0px; padding: 0px; border-collapse: collapse; }
#schlusszeile { position:fixed; bottom:0px; width:100%; padding:0px; text-align: center; color: #FFF; font-size: 11px; background-color:#F00;}
#schlusszeile a, #schlusszeile a:visited, #schlusszeile a:active { text-decoration: none; color: #FFF; font-size: 11px; }
hi,
Das CSS:
Ja, fein gemacht.
Dir wurde eine konkrete Frage gestellt (die sich noch dazu eher auf die HTML-Struktur als auf's CSS bezog) - wieso bitte klatschst du als "Antwort" einfach nur deinen CSS-Code hier rein?
gruß,
wahsaga
Hallo wahsaga,
die Fusszeile ist im body geschrieben worden.
Die Frage habe ich Bobby direkt beantwortet und er wollte den CSS sehen...
lg
Thomas
hi,
die Fusszeile ist im body geschrieben worden.
Die Frage habe ich Bobby direkt beantwortet
Wo und wie - per E-Mail ...?
und er wollte den CSS sehen...
Wenn ihr ausserhalb des Forums diskutieren wollt - dann kannst du ihm dein CSS auch auf diesem Wege zukommen lassen.
Ansonsten ergibt das hier eine für alle anderen nicht achvollziehbare Kommunikation.
gruß,
wahsaga
Hallo,
um es besser verständlich zu machen habe ich
hier noch die index Seite beigefügt.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//DE" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta http-equiv="content-language" content="de">
<title>Start</title>
<link rel="stylesheet" type="text/css" href="css/vorlage.css" media="all">
</head>
<body>
<div id="banner">
<table width="100%">
<tbody>
<tr>
<td width="50%">
<img src="logo.gif">
</td>
<td align="right" valign="bottom" width="50%">
<div id="lieferanten">
<img src="lieferanten.gif" style="border: medium none ;">
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div id="hauptseite">
<div id="links">
<a href="index.htm" class="menue_aktiv">Beginn</a><br>
<a href="news.htm" class="menue">News</a><br>
<a href="produkte.htm" class="menue">Produkte</a><br>
<br>
</div>
<div id="rechts">
<div id="textfeld">
<center>
<h1>Herzlich Willkommen!</h1>
<p>
<img src="leiste.jpg">
</p>
</center>
</div>
</div>
</div>
<div id="schlusszeile">Webseite von Dehumanoid</div>
</body>
</html>
lg
Thomas
Moin
Was soll das position:fixed hier?
#schlusszeile { position:fixed; bottom:0px; width:100%; padding:0px; text-align: center; color: #FFF; font-size: 11px; background-color:#F00;}
ändere dies in absolute und schon funktionierts.
Noch am Rande: Deine Struktur ist mehr als verwirrend. warum arbeitest du mit position:absolute, wo es gar nicht notwendig ist und verschachtelst die Divs in mindestens 3 Ebenen? Das muß nicht sein. Es bläht einen Quellcode nur unnötig auf. Versuche für geschachtelte Divs "normale HTML-Elemente" zu finden, die über CSS formatiert werden können.
Gruß Bobby
Moin
Was soll das position:fixed hier?
#schlusszeile { position:fixed; bottom:0px; width:100%; padding:0px; text-align: center; color: #FFF; font-size: 11px; background-color:#F00;}
ändere dies in absolute und schon funktionierts.
Gruß Bobby
Danke für deine Nachricht.
Ab ist es nicht so, dass bei "position:absolute" die Fussleiste mitscrollt? Ich habe vor, die Leiste starr an den Boden zu binden...
lg
Thomas
Alles klar - herzlichen Dank!!!
Moin
Wo und wie - per E-Mail ...?
Ich wurde ungefragt mit eMails bombadiert. Das mag ich überhaupt nicht. Deshalb sagte ich er solle den Code hier posten. Da habe ich mich wahrscheinlich unglücklich ausgedrückt, sodas nur der CSS-Code hier landete.
Gruß Bobby
Hello out there!
Was kann ich machen, das die Leiste "am Boden" bleibt?
<http://de.selfhtml.org/css/eigenschaften/positionierung.htm#position@title=Fixe Positionierung>. Ob evtl. Würgarounds für veraltete Browser erforderlich sind, musst du entscheiden.
See ya up the road,
Gunnar