Tito: Divs anordnen

Hallo zusammen,
hab mal ein kleines Problem :-(
Zunächst ma kann ich nen bissel CSS und bin nich ganz Planlos.
Mein Problem ist folgendes.
Will nen Layout machn das so aussehen soll.

Ich krig es jetzt einfach nicht hin,
das Content sowie footer zentriert sind und sich richtig ordnen.
Der Content soll ca. 500px breit sein und der footer weiterlaufen, jenach Auflösung. Der Content soll vom oberen Rand ca. 100px nach unten verschoben sein und der footer immer (!) ganz unten. Egal ob das Browserfenster 800px hoch oder 1500px hoch ist, der footer soll immer unten stehen und kann im schlimmsten fall den Content unterlaufen bei zu kleiner Auflösung.

Hab bisher:
[code lang=css
body
{ margin: 0;
padding: 0;
background-image: url(index.jpg);
text-align: center; }

#content
{ width: 500px;
padding: 20px;
background: #ff0000;
margin-top: 100px;
position: fixed;
margin-left: -250px;
left: 50%;
width: 500px; }

#footer
{ padding: 15px;
overflow: auto;
position: fixed;
margin-top: 300px;
margin-left: -500px;
left: 50%;
width: 1000px;
background: #ffffff; }
[/code]

Kann mir da vllt. wer helfen? wäre super =)

  1. Erst mal brauchst Du beim Content und Footer nicht etwa position:fixed, sondern position:absolute. Auch den Content kannst Du absolut positionieren. Hinsichtlich des Wunsches, den Footer unter dem Content verschwinden zu lassen, hilft Dir die CSS-Eigenschaft z-index.

    body { text-align: center } ist keine gute Idee, da diese Eigenschaft vererbt wird und man nach Möglichkeit keine Eigenschaften setzen sollte, die nicht wirklich benötigt werden.

    Gruß, LX

    --
    X-Self-Code: sh:( fo:) ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: Unusual
    X-Please-Search-Archive-First: Absolutely Yes