tutorials.de Buch-Aktion 05/2012
ERLEDIGT
NEIN
ANTWORTEN
7
ZUGRIFFE
773
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. 04.06.09 17:56 #1
    Transmitter Transmitter ist offline Mitglied Brokat
    Registriert seit
    May 2002
    Ort
    Hessen / Gießen
    Beiträge
    397
    Hi,

    ich hätte gern sowas:


    _________________

    leerer Header, immer 100px hoch
    _________________

    eigentliche Seite,
    dynamische Höhe

    _________________ <- Seite endet am unteren Browserrand.

    Also eigentlich benötige ich nur einen Footer, der immer am unteren Seitenrand ist, aber wachsen kann und nach oben immer min. 100px Platz hat.

    Habe schon Threads wie diesen genutzt:
    http://www.tutorials.de/forum/css/22...eitenrand.html
    und die entsprechenden Layouts von Stu Nicholls angepasst. Aber die Footer können dort nicht mit dem Inhalt wachsen.

    Hat da jemand eine Lösung?
    Danke schon mal

    Bye, Transmitter
     
    Zitieren Zitieren
  2. 04.06.09 18:03 #2
    Maik Tutorials.de Gastzugang
    Hi,

    für den Footer mit dynamischer Höhe würde das CSS so lauten:
    Code css:
    1
2
3
4
5
6
7
8

    #footer {
position:absolute;
bottom:0;
left:0;
width:100%;
padding-top:100px;
background:#ccc; /* optional, um die Boxengrenzen bei zunehmenden Inhalt zu erkennen */
}

    mfg Maik
     
    Zitieren Zitieren
  3. 04.06.09 18:34 #3
    Transmitter Transmitter ist offline Mitglied Brokat
    Registriert seit
    May 2002
    Ort
    Hessen / Gießen
    Beiträge
    397
    Hi,

    danke dir für deine schnelle Antwort.
    Das sieht soweit ganz gut aus, nur kann die Seite leider nicht wachsen (also es kommt kein Scrollbalken wenn der Inhalt nicht mehr in den Browser passt).

    Code :
    1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58

    <!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="en">
<head>
<title> No </title>
 
<style type="text/css">
#footer {
position:absolute;
bottom:0;
left:0;
width:100%;
padding-top:100px;
background:#ccc;
}
 
 
</style>
 
</head>
 
<body>
<div id="footer"> asfdasdf<br />
asfd<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf<br />
asdf
</div> 
</body>
</html>
     
    Zitieren Zitieren
  4. 04.06.09 18:36 #4
    Maik Tutorials.de Gastzugang
    Über den Viewport hinaus lässt sich auch nicht nach oben scrollen.

    mfg Maik
     
    Zitieren Zitieren
  5. 04.06.09 19:40 #5
    Transmitter Transmitter ist offline Mitglied Brokat
    Registriert seit
    May 2002
    Ort
    Hessen / Gießen
    Beiträge
    397
    Nicht nach oben, ich will ja nach unten scrollen.

    Bei mir läuft der Text einfach oben raus, ich hätte aber gerne, dass man dann nach unten scrollen kann, sobald der Inhalt zu groß wird für den Viewport.
     
    Zitieren Zitieren
  6. 04.06.09 20:11 #6
    Maik Tutorials.de Gastzugang
    Wenn ein Element am unteren Fensterrand ausgerichtet / positioniert wird, damit sein Inhalt nach oben wandert, lässt sich die Seite nicht nach unten scrollen, denn seine Startposition ist ja weiterhin im Viewport sichtbar.

    mfg Maik
     
    Zitieren Zitieren
  7. 04.06.09 20:34 #7
    Transmitter Transmitter ist offline Mitglied Brokat
    Registriert seit
    May 2002
    Ort
    Hessen / Gießen
    Beiträge
    397
    Das klingt logisch.
    Impliziert das dann, dass es nicht klappt wie ich es vor habe?
     
    Zitieren Zitieren
  8. 04.06.09 20:37 #8
    Maik Tutorials.de Gastzugang
    Sieht ganz danach aus

    mfg Maik
     
    Zitieren Zitieren
« Text mittig zentrieren nach Bild | Wrap IE korrekt, Firefox ignoriert es »

Ähnliche Themen

  1. Fixieren am unteren Rand
    Von mike4004 im Forum CSS
    Antworten: 14
    Letzter Beitrag: 21.08.07, 23:11
  2. oberen und unteren rand eines divs am fensterrand ausrichten..
    Von abubububu im Forum CSS
    Antworten: 2
    Letzter Beitrag: 31.05.06, 00:09
  3. Abstand vom unteren Rand
    Von 's KATERchen im Forum CSS
    Antworten: 3
    Letzter Beitrag: 17.03.06, 17:48
  4. Tabelle bis an den unteren Rand des IE
    Von vendy im Forum HTML & XHTML
    Antworten: 4
    Letzter Beitrag: 05.05.05, 14:51
  5. flimmern am unteren rand
    Von dado26 im Forum Videoschnitt, Videotechnik & -produktion
    Antworten: 3
    Letzter Beitrag: 15.02.05, 17:34