XHTMLforum - Footer "schrumpft" in Chrome

XHTMLforum (http://xhtmlforum.de/index.php)

- CSS (http://xhtmlforum.de/forumdisplay.php?f=73)

- - Footer "schrumpft" in Chrome (http://xhtmlforum.de/showthread.php?t=66792)

Doublerainbow

01.02.2012 18:51

Footer "schrumpft" in Chrome

Hallo ihr,

ich erstelle momentan eine Homepage als Hausaufgabe für die Uni und habe dabei folgendes Problem:

Wenn ich die Seite ( Link: Mein Blog - Backen mit Liebe ) in Chrome öffne, ist der Footer ein kleines Stückchen zu kurz, also geht nicht bis zum rechten Rand des weißen Content-Bereiches...

Wisst ihr was ich ändern muss, um diesen Fehler zu beheben?

In der CSS-Datei ist der Footer so festgelegt:

Code:

footer {

        background: #f2e2dc;

        width: 870px;

        margin-left: 100px;

        margin-bottom: 40px;

        padding: 15px;

        font-family: Arial, sans-serif;

        font-size: 12px;

        color: #c79f8b;

}

Mit freundlichen Grüßen

Maria

Edit: Der Inhalt is teilweise vorgeschrieben und wahllos, also bitte keine Kommentare dazu.. ;)

plastiko

01.02.2012 20:07

Zitat:

Footer "schrumpft" in Chrome

Nein, #content ist im Chrome zu breit.
padding: 0; für #content ändert das.

Die html5-Elemente kennt kein IE<9. Die display: table-Eigenschaften kennt kein IE<8.

IChao

01.02.2012 20:19

Zitat:

Zitat von plastiko (Beitrag 510723)

Nein, #content ist im Chrome zu breit.
padding: 0; für #content ändert das.

Interessant ist, dass es sich um ein padding-top handelt, was da auf 0 gesetzt werden muss. Bug im Browser, würde ich vermuten. Safari sieht (noch) gut aus.

Doublerainbow

01.02.2012 20:19

@ plastiko: Danke für deine Hilfe. Leider scheint dein Tipp das Problem nicht zu beheben... :(

IChao

01.02.2012 20:30

Doppelterregenbogen, die doppelte Angabe hilft dir nichts:

Code:

#content {

        display: table; 

        background: #ffffff;

        width: 900px;

        padding: 0;

        padding-top: 20px;

        margin-left: 100px;

}

Da es eine Hausaufgabe ist, gucks dir selbst noch mal an, was hier falsch ist.

IChao

01.02.2012 20:51

Wie auch immer, im letzten Canary Build von Chrome sieht alles wieder gut aus.

Code:

<!doctype html>

<html>

<head>

<style>

#ruler {width: 100px; background: green;}

#table {display: table; background: red; padding-top: 20px; width: 100px; }

</style>

</head>

<body>

<div id="ruler">R</div>

<div id="table">T</div>

</body>

</html>

Doublerainbow

01.02.2012 22:00

Zitat:

Zitat von IChao (Beitrag 510727)

Doppelterregenbogen, die doppelte Angabe hilft dir nichts:

(...)

Da es eine Hausaufgabe ist, gucks dir selbst noch mal an, was hier falsch ist.

Danke für diese Lehrstunde! ;)
Wenn ich padding-top wegmache funktioniert es sogar, aber dann fehlt mir der Abstand oben. Wenn die Überschriften an der Navigation kleben sieht das nicht so schön aus... :( Was mache ich da? Und liegt das echt am Browser dass der damit nicht klar kommt oder darf man sowas einfach nicht machen? :D (Padding-Top = No go?!)

Edit: Habe nun einfach jeweils in "section" und "aside" den padding-top Teil eingefügt... trotzdem würde ich das Problem gern "verstehen"... :D

IChao

02.02.2012 08:53

padding-top ist so unschuldig wie ein Grashalm. Nur diese spezielle Version des Google Chrome hat offenbar einen Bug bei padding-top einer Tabelle, was für sich genommen erstaunlich ist, weil es doch einige Seiten zerschossen haben müsste.

Dass es ein Browser-Bug ist, schließe ich daraus, dass kein anderer Browser das Problem zeigt und die nächste Version des Chrome (das Canary Build) nicht mehr betroffen ist.

Browser Bugs an sich sind nichts Ungewöhnliches, muss man mit leben.

Alle Zeitangaben in WEZ +2. Es ist jetzt 13:24 Uhr.