• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

footStickAlt

sin777

Neues Mitglied
Hallo,

ich bin bezüglich meines Problems auf das Schlagwort "footStickAlt" gestoßen und hoffe, dass ihr wisst, worum es sich dreht.
Hier erstmal mein Code:

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">

<head>
    <title>Titel</title>

    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
    <meta name="description" content="" />
    <meta name="author" content="" />
    <meta name="keywords" content="" />
    <style type="text/css">
        * {
            margin: 0px;
        }
        #kopf {
            background-color: yellow;
        }
        #main {
            background-color: blue;
        }
        #fuss {
            margin-top: -1.5em;
            background-color: red;
        }
        html, body {
            height: 100%;
        }
        body {
            font-size: small;
        }
        #wrapper {
            min-height: 100%;
        }
    </style>
</head>
<body>
    <div id="wrapper">
        <div id="kopf">Das ist die Kopfzeile</div>
        <div id="main">
            <h2>Das ist der Inhaltsbereich</h2>
            <ul>
                <li>Punkt 1</li>
                <li>Punkt 2</li>
                <li>Punkt 3</li>
                <li>...</li>

            </ul>
        </div>
    </div>
    <div id="fuss">Das ist die Fu&szlig;zeile</div>
</body>
</html>

Meine Fußleiste ist immer ganz unten, so wie ich es will. Das passt also so weit. Mein Problem ist nur, wenn jetzt der Inhalt zu groß wird oder ich das Fenster so klein mache, dass die Fußleiste den Inhalt berührt, dann rutscht sie in diesen hinein und verdeckt evtl. Inhalt. Um das deutlich zu machen, könnt ihr ja nochmal 20 <li>'s einfügen, dann sieht man mein Problem. Wie kann ich das noch lösen, also dass die Fußleiste nicht in den Inhalt rutscht.

Vielen Dank im Voraus :)
 
Hi,
das sollte eigentlich schon gehen, wenn du #wrapper "margin-bottom:19px;" gibst. Das margin-bottom sollte dann immer so viel sein, wie die Höhe des Footers, dann schießt dein Content auch nicht über den Footer hinaus.
 
Zurück
Oben