nicht angemeldet
falsches Rendering von Firefox - korrekt nach refresh
hallo,
meine page hat einen footer der fixed bzw. absolute (IE) definiert ist.
IE7 und sogar Konqueror stellen den footer korrekt dar, firefox allerdings erst nach einem page refresh (F5).
die page ist valides xhtml 1.0.
page: www.sls.io/test
css: www.sls.io/test/css/style.css
Hat jemand einen Lösungsvorschlag?
Danke im voraus.
- Gregor
-
Guten Tag, mein Name ist Brigitte Jokil.
IE7 und sogar Konqueror stellen den footer korrekt dar, firefox allerdings erst nach einem page refresh (F5).
die page ist valides xhtml 1.0.
Angesichts der Tatsache, dass Tabellenlayout genauso wenig im Sinne der XHTML-Erfinder ist wie als Grafik verpackte Texte schön sind, ziehe ich diese Aussage einfach mal in Zweifel.
Hat jemand einen Lösungsvorschlag?
Die vollkommen überflüssige Fußtabelle rauswerfen und stattdessen einen ordentlichen Absatz rein:
<p style="position:fixed; bottom:0; width:100%; height:99px; padding:0; background-image:url(../images/background_4.png); text-align:center;">
<img src="../images/footer.png" style="display:inline">
</p>(display:inline nur, weil anderswo display:block für <img> gesetzt ist.)
Oder noch besser so:
<div style="position:fixed; bottom:0; width:100%; height:99px; background-image:url(../images/background_4.png);">
<p style="width:770px; margin:0 auto; padding:30px 0 0 0; line-height:69px; color:#fff; font-size:smaller">
Gregor blabla
</p>
</div>-
<div style="position:fixed; bottom:0; width:100%; height:99px; background-image:url(../images/background_4.png);">
<p style="width:770px; margin:0 auto; padding:30px 0 0 0; line-height:69px; color:#fff; font-size:smaller">
Gregor blabla
</p>
</div>Danke für das Code-Snipplet. Jetzt wird es richtig gerendert.
allerdings ist das image (footer.png) jetzt nicht mehr zentriert,
sondern linksbündig.welcher style ist hinzu zu fügen bzw. zu verändern um das footer img zentriert darstellen zu lassen?
- Gregor
-
<div style="position:fixed; bottom:0; width:100%; height:99px; background-image:url(../images/background_4.png);">
<p style="width:770px; margin:0 auto; padding:30px 0 0 0; line-height:69px; color:#fff; font-size:smaller">
Gregor blabla
</p>
</div>Danke für das Code-Snipplet. Jetzt wird es richtig gerendert.
allerdings ist das image (footer.png) jetzt nicht mehr zentriert,
sondern linksbündig.Falls du auf die Grafik bestehst, benutze nicht obigen zweiten Vorschlag, sondern den ersten:
<p style="position:fixed; bottom:0; width:100%; height:99px; padding:0; background-image:url(../images/background_4.png); text-align:center;">
<img src="../images/footer.png" style="display:inline">
</p>Tipp: Mit der Firefox-Erweiterung Firebug kannst du CSS-Eigenschaften wie auch den HTML-Code direkt im Browser ändern. Erleichtert das Probieren bzw. die Fehlersuche ungemein, weil die lästige Wechselei zum Texteditor wegfällt.
-
-
hi,
mein IE zeigts auch nicht korrekt an. FF auch nach Refresh nicht.
Footer rutscht hoch und verdeckt den Text sowie die Scrollleiste.
