Gut, wie gesagt den Begriff kannte ich noch nicht. Aber ist in Ordnung, ich lerne gerne etwas dazu. Vor allem wenn es nett erklärt wird.

Ich nehme mal an wegen dem Border!? Den hab ich jetzt mit box-sizing mit in die 40px gebracht. Irgendetwas ist da immer noch falsch.

Ok, das schaue ich mir dann später an wenn das mit dem Footer funktioniert. Hast Recht, einen z-index braucht das Bild eigentlich auch nicht.

Danke schön, schaue ich mir beide auf jeden Fall an.

Du siehst das falsch, ich "erwarte" keinen kostenlosen Support! Ich habe ein Problem, welches im entsprechenden Forum gepostet habe. Ich freue wenn sich jemand die Zeit nimmt und sich dieses anschaut. Noch mehr freue ich mich wenn mir gezeigt wird wo mein Fehler ist und ich daraus lernen kann. Ich erwarte von niemandem etwas und niemand MUSS antworten.

Wie gesagt, ich weiß nicht alles... Du weißt nicht alles... und ich bin sicher ein absoluter Guru übersieht auch mal in seinem Code einen Fehler oder irgendwas... und wenn man denjenigen diesen zeigt, heißt es dann mal "oh ja klar, stimmt!" oder eben "Danke, das wusste ich nicht"

Also ich persönlich erwarte nicht für jede Leistung immer eine Gegenleistung. Manchmal muss man auch erst Unterstützung erhalten und lernen um unterstützen und lehren zu können. Meine Meinung.

Was ich gerade sehe, im Firefox sind die Inhalte vom Footer unter der Leiste selbst, aber im Chrome sind sie drin.... ganz komisch jetzt
Konzeptseite mit Background

Ich weiß nicht, was du meinst. Bitte beschreib dein Problem.

Es geht nicht darum, dass ich eine Gegenleistung erwarte.
(Wobei es aber ganz sicher so ist, dass jemand durchaus geduldigere Antworten bekommen kann, der nicht nur in diesem Forum auftaucht, um seine eigenen Probleme vorzutragen, sondern auch immer mal versucht, anderen zu helfen. Dies nur als Anregung.)
Ich helfe gerne hier -- aber ich bin nicht hier, um kostenlosen Support zu leisten. Dafür gibt es das Jobforum.
Mein Anliegen ist es, den Fragenden dazu zu bringen, sich eine Lösung selbst zu erarbeiten. Ich weiß ganz sicher, dass derjenige davon sehr viel mehr hat, als wenn man ihm einen Codeschnipsel hinwirft. Dann steht er nämlich gleich wieder da und es wird die Geschichte mit dem kleinen Finger und der ganzen Hand.

edit:
Es fehlt jetzt ein wichtiger Bestandteil dieser Technik. Der Platz, den der Footer einnimmt, muss im Hauptinhalt freigehalten werden -- sonst kommt es zu Überlappungen und im Zusammenhang mit float (und clear) zu solch scheinbar merkwürdigen Erscheinungen, wie du sie jetzt siehst. Da hattest du mal ein Padding, das fehlt jetzt. Da ein Padding ebenso "problematisch" wie ein border ist, wenn man ein Element 100% hoch haben will: Überleg doch mal, wo du noch diesen nötigen Abstand unterbringen könntest.
(In den FAQ ist der bereits genannte Artikel FooterStickAlt verlinkt. Das steht das alles drin. Bitte arbeite das ganz genau durch.)

__________________
Corina Rudel

Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken

Da ist noch immer ein Abstand nach unten von etwa 2 Pixel. Ich nehme mal an das kommt vom border-top. Allerdings hab ich doch box-sizing:border-box. Ich dachte damit wird der Border mit in die Größe genommen. Und wenn ich so jetzt beim #maincontentcontainer den unteren margin auf -42px setze, bleibt es gleich. Keine Besserung.

Anregung angekommen! Und wenn ich mal auf einen Thread stoße wo ich etwas weiß, werde ich bestimmt auch meinen Senf dazu geben.

Ja, das mit der Hilfe zur Selbsthilfe ist ja auch wirklich gut! Aber ich denke wenn es wirklich nicht klappt, dann kann man auch den Fehler direkt zeigen und sagen "so ist es richtig, darum hat es nicht geklappt". Wenn der Fragende/Hilfesuchende gar nichts selber machen und nur auf einen Codeschnipsel warten würde... gebe ich Dir Recht.

Also ich hab jetzt da über dem Footer noch eine Leiste eingefügt mit clear:both, damit ist der Abstand gegeben. Ich weiß, das ist bestimmt nicht die sauberste oder beste Art... aber es ist das was mir jetzt einfällt als Lösung.
Der Artikel FooterStickAlt macht den Footer aber ganz anders als ich hier machen möchte. Dort wird der Footer selbst ja mit einem negativen margin nach oben geholt. Was ich machen möchte ist aber, dass der #maincontentcontainer den Footer nach unten an den Rand drückt.

Problem ist jetzt noch der kleine Abstand unten, dass im Firefox und IE der Footerinhalt außerhalb ist... und diese vier Boxen, die ich jetzt auch ausgefüllt habe werden im Chrome richtig nebeneinander angezeigt, im FF und IE wieder komisch umgebrochen.

Danke für den Link. Hier wird jetzt wieder mit absoluter Positionierung gearbeitet. Geht sicher auch... allerdings würde ich wirklich gerne wissen wo verdammtnochmal (sorry!) ich hier diesen blöden Fehler hab. Das juckt mich jetzt tierisch.

Was bewirkt deiner Ansicht nach box-sizing:border-box, das du jetzt beim Footer stehen hast?


Nein, das brauchst du nicht. Außerdem sind 10px zu wenig, um den Platz für den Footer freizuhalten!
Gib das padding dem #maincontent.
Das geht auch oben, dann kannst du dieses leere Bild auch entsorgen.


Doch, das Prinzip ist genau das gleiche. Bei dir hat der #maincontentcontainer einen unteren negativen margin. Das läuft auf das gleiche raus, wie dem footer einen oberen zu geben.

__________________
Corina Rudel

Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken

Soweit ich das richtig verstanden habe, bewirkt border-box, dass border und padding einen div-container nicht vergrößern, sondern z.B. border von innen und nicht von außen gezogen wird.

Ok, hab dem #maincontent ein padding nach unten von 40px; gegeben. Soweit so gut Nach oben hab ich das mit dem Bild gemacht, weil ich dachte wenn das Fenster verkleinert wird, wird auch der Abstand durch das verkleinerte Bild angepasst. Deswegen keine feste Pixel-Angabe. Mit Prozent hat das nicht ganz so geklappt, daher war das die Notlösung.

Ahso, ok. Dann muss der kleine Abstand unten doch irgendwie noch vom footer-border verusacht sein.

Das Problem, dass der Footerinhalt in FF und IE drunter waren hab ich gefunden

Aber warum die letzte der vier Boxen jetzt im FF umgebrochen wird, ist mir trotzdem zusätzlich ein Rätsel...

Edit: Also die Boxen werden wegen dem padding, das sie hatten umgebrochen. Aber auch hier hab ich border-box... also nach meinem Verständnis müsste das gehen

Ja, eben. Und wie hoch ist der footer dann?


Ich weiß nicht, wovon du redest. Wann ist das Bild verkleinert?


Das liegt daran, dass der FF box-sizing noch nicht ohne Prefix unterstützt.

__________________
Corina Rudel

Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken

Ich würde sagen genau 40px dann.

Das war Schwachsinn.... hab's jetzt geändert mit einem padding oben wie Du vorgeschlagen hattest.

Ja, verdammt das hab ich vergessen. Hatte es mir auch extra vorhin nochmal angeschaut... jetzt passt es auch da

Eben. Deshalb waren die 42px beim negativen Margin zu viel und es gab eine Lücke.

Jetzt solltest du die height im Footer noch zu einer min-height ändern. Bei kleinem Viewport reichen die 40px nicht.
Und wenn du das Ganze noch mit em machst, geht auch bei Schriftvergrößerung nichts mehr kaputt.

__________________
Corina Rudel

Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken

Jaaaa da war noch eine ganz kleine Lücke und mit min-height ist die jetzt auch weg Danke schön! Aber warum min-height hier? Hätte das nicht schon ohne min passen müssen? Der IE kann doch kein min-..., oder? Muss ich dafür nicht doch noch normal height angeben? Eigentlich wird es aber auch bei mir im IE richtig angezeigt jetzt so...

Ah ok! Wusste nicht, dass em-formatierte Elemente so einen Vorteil haben. Bei welchen Elemente empfiehlst Du das? Nur welche, die Text beinhalten?
Hmmm.... nur wie kriege ich die entsprechenden em-Maße zu meinen Pixel-Angaben?

Edit:
Habe einen Umrechner gefunden... da em ja auf Basis der Hauptschriftgröße ist, muss ich das ja erstmal wissen.
Also im body steht font: 100%/1.4 ...;

Ehrlich gesagt weiß ich nicht genau was diese Formatierung bedeutet, so hab ich das noch nie gesehen.

Edit 2:
Ah ok, jetzt weiß ich. 100% ist die Schriftgröße, 1.4 die Zeilenhöhe. Aber in welchem Format ist dann das 1.4? px? em? pt? %?