Kann nicht CSS Sticky footer zu arbeiten. Was mache ich falsch?

Gut, dies ist mein Erster post hier und wirklich genießen die Website.

Ich habe eine sehr einfache (hässlich wie die Sünde) Seite, die ich angefangen habe und aus irgendeinem Grund, ich kann nicht die CSS Sticky footer zu arbeiten für FireFox. IE funktioniert aber FF zeigt es in der Mitte der Seite.

Die URL ist http://dev.aipoker.co.uk

Ich weiß, ich sollte die Entwicklung im FF und-Behebung im IE-so ich vermute, ich habe vielleicht einen Fehler gemacht und irgendwie funktioniert es im IE, aber sonst nirgendwo.

Kann mir jemand helfen, hat mich aus meinem Elend bitte?

Dank, Jungs und Mädels.

  • Fx 3.0.x auf WinXP sieht fast die gleiche wie IE7 auf dieser Maschine. Können Sie uns ein Bild oder mehr detail über das, was Sie versuchen zu erreichen (link zum funktionierenden Beispiel wäre auch nett.)
InformationsquelleAutor Jon | 2008-10-01
  1. 3

    Versuchen, diese ein, funktioniert es auch auf Firefox.

    BTW, sollte man sich anhören Boagworld ' s podcast, wenn Sie nicht bereits. It ' s brilliant! 🙂

    Cheers.

    InformationsquelleAutor dguaraglia
  2. 4

    Hatte ich Erfolg mit code wie diesem:

    footer { 
  display: block; 
  position: absolute; 
  width: 100%; 
  bottom: 0px; 
}
    • Es (immer) klebt auf der Unterseite, sondern überlagert das eigentliche container-Inhalt.
    InformationsquelleAutor zigdon
  3. 1

    Den minimalen änderungen, die ich sehen kann, um dies zu tun wäre:

    • bewegen footerSection im inneren des Körpers
    • set position absolute auf Körper und footerSection
    • set bottom = 0px auf footerSection

    was am Ende mit etwas wie dieses in Ihrem Kopf:

    <style type="text/css">
  #body, #footerSection { position: absolute; }
  #footerSection { bottom: 0px; }
</style>

<div id="body">
   ...
   <div id="footerSection">
      ...
   </div>
</div>
    InformationsquelleAutor Mark Brackett
  4. 1

    Dies ist alles, was Sie wissen müssen über css sticky footers & klebrig navs:

    Stick unten auf der Seite 

    Position: absolute;
top:auto;
bottom: 0;

    Stick nach unten auf dem Bildschirm

    Position: fixed;
top:auto;
bottom:0;

    Irgendwelche Probleme und es ist wahrscheinlich, da, wo das Sie Ihren html-code (nicht in die Fußzeile ein Kind-element, es sei denn, es ist das festhalten an der content-wrapper), oder sich überlappende CSS.

    Wenden Sie die gleiche Technik, sticky navigation durch Umklappen der auto & top. Es ' SIS cross-browser-kompatibel (Aus dem Gedächtnis von IE7 und höher), einschließlich Handys.

    InformationsquelleAutor Undefined
Schreibe einen Kommentar