Hallo zusammen,
da dies eine Frage ist die nicht direkt Typo3 betrifft, habe ich sie in diese Rubrik gepackt. Es geht um folgendes:
Ich habe eine Website, mit einem 2 contentbereichen, unten soll ein Footer sein. Der Footer soll immer am unteren Browserrand stehen, es seidem der Content ist länger, dann soll der Footer nach unten rutschen.
Kann mir jemand verraten wie das gehen soll? Leider ist die Seite nicht online verfügbar. 🙁
Im CSS habe ich die Position des Footer relativ gesetzt, wenn nun aber der Content länger wird, bleibt der footer stehen und der Content "fließt" einfach durch.
Wenn jemand ein schönes Howto hat oder ein ähnliches Problem, bitte melden.
Danke und Grüße
Thomas
Hi thomasju, ohne Dein CSS-Format kann Dir glaube ich keiner helfen. Gruss Mensch
Hi Mensch,
args voll vergessen...
/*
-------------------------------------------------------
HTML Elements
-------------------------------------------------------
*/
html, body {
margin:0;
padding:0;
height:100%;
text-align: center;
font-size:10px;
}
body {
font-family:Arial,Helvetica,sans-serif;
font-size:10px;
margin:0;
padding:0;
height:100%;
}
...
...
...
/*
-------------------------------------------------------
DIV Containers
-------------------------------------------------------
*/
#wrapper {
width:778px;
text-align:left;
margin:0;
border-left:1px solid #ccc;
border-right:1px solid #ccc;
margin:0px auto;
}
/* IE Fix: Der IE interpretiert height als min-height */
* html #wrapper {
height: 100%;
}
#logo {
color:#000;
background-color:transparent;
}
#mainmenu {
color:#000;
background-color:#9C1F2D;
width:100%;
}
#mainmenu table {
width:100%;
margin:0;
padding:0;
border:0;
}
#submenu {
clear:both;
background:#D8E0ED;
color:#000;
height:22px;
line-height:2.1em;
}
#head {
color:#000;
width:100%;
height:100px;
}
#content {
width:778px;
color:#000;
text-align:left;
}
#content-table {
margin:0 0 0 0;
}
#content-table td {
vertical-align:top;
}
#content-left {
vertical-align:top;
width:267px;
}
#content-left p {
margin:0;
font-size:1em;
}
#content-left table {
width:100%;
}
#content-left td {
border-bottom:1px solid #ddd;
line-height:1.8em;
}
#content-left h1, #content-left h1, #content-left h2, #content-left h3, #content-left h4 {
}
#content-left h2 {
}
#content-left img {
margin:0;
}
#content-right {
width:511px;
vertical-align:top;
}
#content-right p {
margin:0;
font-size:1em;
}
#content-right h1, #content-right h1, #content-right h2, #content-right h3, #content-right h4 {
}
#content-right h2 {
}
#content-right img {
margin:0;
}
#content-right th {
text-indent:0.3em;
}
#content-right td {
}
#content-right td p {
margin:0;
font-size:1em;
}
#footer {
position: relative;
bottom:0;
width:778px;
text-align: left;
margin: 0 auto;
height: 40px;
background-color:transparent;
}
#footer1 {
color:#fff;
background-color:#C17877;
line-height:20px;
height:20px;
font-size:1.1em;
text-align:center;
}
#footer1 a:link, #footer1 a:visited, #footer1 a:active, #footer1 a:hover {
color:#fff;
text-decoration:none;
}
#footer2 {
color:#fff;
background-color:#AD2624;
line-height:20px;
height:20px;
font-size:1.1em;
text-align:center;
}
#footer2 a:link, #footer2 a:visited, #footer2 a:active, #footer2 a:hover {
color:#fff;
text-decoration:none;
}
Habe die Navigation etc rausgelassen.
Grüße
Thomas
Hi thomasju,
werde versuchen mir das mal anzuschauen, brauche jedoch Dein HTML-Grundgerüst. Du scheinst mit Tabellen zu arbeiten und der Footer soll anscheinend unterhalb der Tabellen positioniert werden?
Gruss Mensch