tutorials.de Buch-Aktion 05/2012
ERLEDIGT
JA
ANTWORTEN
11
ZUGRIFFE
1957
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. #1
    fjordblauer Tutorials.de Gastzugang
    Hallo,

    möchte einen Footer unter meinen Menü und Inhalt- Layer anzeigen lassen. Nur weiß ich leider nur wie ich diesen absolut zum unteren Bildschirmrand positioniere. Bei einem großen, langem Inhalt überschneiden sich dann diese beide "Kästchen". Brauche einen kleinen schubs von euch wo ich suchen kann, bzw. wie es geht.

    Dirk
     

  2. #2
    Registriert seit
    Dec 2002
    Ort
    Trier
    Beiträge
    17.502
    Blog-Einträge
    10
    Lies dir mal folgenden, auf A List Apart erschienenen Artikel durch:
     

  3. #3
    fjordblauer Tutorials.de Gastzugang
    Naja. Danke.

    Hier mein Beispiel www.auf-eigenen-wunsch-entfernt.

    Der Footer soll halt am liebesten immer unten sein, wenn man aber das Fenster so verkleinert ist der Inhalte- Layer im Weg. Versteht ihr?

    Dirk
     

  4. #4
    fjordblauer Tutorials.de Gastzugang
    Nun, hab doch etwas hinbekommen.

    Guckt unter dem o.g. Link.

    Nun möchte ich aber das der Inhalt bis zum Footer runterkommt, wie stell ich das an. Mit "height: 100%" gehts nicht...

    Aber ein 2. Problem: Wenn ich ein padding auf den Inhalt Layer lege, rückt z.B. der Netscape 7 alles um die breite nach rechts, Firefox und Opera auch, nur IE nicht. Wieso denn?
     

  5. #5
    CSS Depp CSS Depp ist offline Mitglied Bronze
    Registriert seit
    Dec 2004
    Beiträge
    31
    auf die gefahr hin dass ich mich irre.

    du willst etwas machen, was relativ zur browserfenstergrösse ist, das wird
    mit CSS nicht gehen, und wenn, dann ist es sicher eine IE Windows only
    lösung.
    javascript´s "available height" wird dich da weiter bringen, so wie in diesem
    artikel da ... obwohl das recht kompliziert aussieht was die da machen.


    >Wenn ich ein padding auf den Inhalt Layer lege, rückt z.B. der Netscape 7
    >alles um die breite nach rechts, Firefox und Opera auch, nur IE nicht. Wieso denn?

    weil tabellen generell kein "richtiges" html sind. das ist ein IE propetiäres format.
    einige browser können daher styles für tables nicht so darstellen wie der IE.
    sobald deine tabelle in einem übergeordneten div liegt, was styles hat, wirds
    sehr undurchsichtig. eigentlich müssten tabellen tags <wutanfall> heissen.
     

  6. #6
    fjordblauer Tutorials.de Gastzugang
    Das habe ich aber schon irgendwo gesehen.

    Ein Layer mit Banner oben. Ein Layer z.B. mit dem Inhalt darunter und dann unten der Footer im eigenen Layer.

    Wenn der Banner eine Höhe von 100px hat, und im Inhalt nur 2 Zeilen Text stehen, dann sollte der Inhalte Layer trotzdem bündig mit dem Footer Layer abschliessen, der widerrum ganz unten ist.

    Ist der Inhalte Layer jetzt sehr voll geshrieben, über die Bildschirmhöhe, soll der Footer wieder an sein Ende rutschen.

    @CSS Depp:

    Wieso Tabellen? Ich nutze gar keine Tabellen Tags, oder fällt Padding damit rein? Es funktioniert doch auch bei Layern..?
     

  7. #7
    Quaese Quaese ist offline Moderator
    tutorials.de Moderator
    Registriert seit
    Feb 2004
    Beiträge
    3.451
    Hi,

    ich habe mir selbst mal eine kleine Anleitung zu einem Layout mit 100% Höhe geschrieben.
    Die schicke ich Dir einfach mal mit ... musst Dich halt durcharbeiten.

    Als Grundlage diente mir die Vorgabe von Stu Nicolls

    Ciao
    Quaese
    Angehängte Dateien Angehängte Dateien
     
    Vielleicht muss man manchmal vom Weg abkommen, um nicht auf der Strecke zu bleiben!
    ----
    Der "Fortsetzungsroman" auf www.leuteforum.de

    New kind to realize large scalable projects with jQuery: jQuery SDK

  8. #8
    fjordblauer Tutorials.de Gastzugang
    So, vielen Dank erstmal für den Download!

    Habe mir das mal genauer angeguckt:

    Im Firefox, NN und Opera sieht es so aus wie ich es vom Design her haben möchte.

    Nur der IE macht mir zwei Problem:

    1. Bringt er eine horizontale Scrollleiste wenn auch die vertikale kommt und ohne die Leiste könnte man den Text wohl nicht ganz lesen können.

    2. Habe ich einen Rahmen (border) definiert. Dieser ist aber schwarz, stattdessen möchte ich meine Linien vom Hintergrund haben. Wie gehe ich denn nun vor?

    fjordblauer
     

  9. #9
    fjordblauer Tutorials.de Gastzugang
    nerv, schieb

    Ist schon wichtig für mich. Ihr wisst das doch bestimmt!
     

  10. #10
    Avatar von hela
    hela hela ist offline Mitglied Smaragd
    tutorials.de Premium-User
    Registriert seit
    Oct 2004
    Beiträge
    1.123
    Hallo fjordblauer,

    zu 1.)
    Der Internet-Explorer braucht eine expressive Breitenangabe für den rightDiv-Container. So wie du im leftDiv-Selektor "width:100px;" stehen hast, müsstest du auch im rightDiv-Selektor "width:490px" reinschreiben (wenn ich richtig gerechnet habe). Der Container hätte dann die richtige Breite und der horizontale Scrollbalken verschwindet.

    zu 2.)
    Der Internet-Explorer kann keine transparenten Rahmen darstellen. Damit der leftDiv- und der rightDiv-Container auf eine Höhe von 100% kommen, hast du in den Star-Html-Selektoren diesen Blöcken oben einen 160px und und unten einen 30px größen Rand gegeben. Da keine Farbangaben gemacht werden, stellt der IE diese Ränder schwarz dar.
    Du hast also nur zwei Möglichkeiten: Entweder du deckst diese Ränder mit dem Header und dem Footer vollständig ab oder du gibst diesen Rändern die Hintergrundfarbe, so dass sie nicht auffallen. In diesem Fall kannst du natürlich kein zusammenhängendes Hintergrundbild im BODY darstellen.
     

  11. #11
    fjordblauer Tutorials.de Gastzugang
    Super, Danke!

    Habe etwas im Design verändert.

    1.) Der Opera stellt den contentDiv am Übergang zum footerDiv anders da. Hier sind einige Pixel Luft. Woher kommt das?

    2.) Der IE stellt neben dem mainmenueDiv keinen Text mehr da. Alle anderen Browser machen das aber? Wieso?

    Gruß!
     

  12. #12
    fjordblauer Tutorials.de Gastzugang
    Nerv -> schieb...

    Ist doch wichtig für mich!
     

Ähnliche Themen

  1. Vertikal ausrichten
    Von EGJSoldier im Forum CSS
    Antworten: 4
    Letzter Beitrag: 01.03.10, 19:14
  2. Pfadtext vertikal ausrichten
    Von Jan-Frederik Stieler im Forum Vektor-Programme
    Antworten: 3
    Letzter Beitrag: 04.10.08, 03:59
  3. mehrere div's vertikal ausrichten
    Von herrgarnele im Forum CSS
    Antworten: 5
    Letzter Beitrag: 12.12.06, 09:29
  4. Text Vertikal ausrichten
    Von LoMo im Forum CSS
    Antworten: 2
    Letzter Beitrag: 10.07.06, 14:35
  5. text vertikal ausrichten
    Von das_element im Forum CSS
    Antworten: 3
    Letzter Beitrag: 09.01.06, 21:13