2017-08-03 1 views
-4

Ich bin neu hier, Entschuldigung, wenn etwas nicht stimmt.Platz zwischen Körper und Fuß

Also ich bin wirklich neu in HMTL/CSS, ich habe viel bisher gelernt. Im Moment habe ich Probleme, viel Platz (~ 30-40px) zwischen dem Inhalt meiner Seite und meiner neuen Fußzeile zu bekommen. Ich habe versucht, eine margin-top sowie eine padding-top hinzuzufügen, aber sie scheinen keinen Effekt zu haben. Mein Footer wird von div class footer gemacht.

My jsFiddle

Ich bin mit Google Chrome und auf Sublime Text zu schreiben.

+2

"_Fragen, die Debugging-Hilfe suchen (" Warum funktioniert dieser Code nicht? ") Müssen das gewünschte Verhalten, ein spezifisches Problem oder einen Fehler und ** den kürzesten Code enthalten, der für die Reproduktion in der Frage benötigt wird Eine klare Problembeschreibung ist für andere Leser nicht nützlich. Siehe: So erstellen Sie ein minimales, vollständiges und verifizierbares Beispiel._ " – csmckelvey

+0

@csm_dev ist keine funktionierende Geige genug? –

+1

Gemäß den Markierungsoptionen, die ich oben zitiert habe, nein. Geige ist gut, aber der Code muss in der Frage selbst sein - Links brechen. – csmckelvey

Antwort

0

Sie müssen den Schwimmer im mittleren Container leeren.

#homeboxes:after { 
    clear: both; 
    content: ""; 
    display: block; 
} 

Fügen Sie diesen Code zu Ihrem CSS hinzu und Sie können den Rand oben auf Ihrem #footer div.

Ich würde empfehlen, dies zu lesen: https://alistapart.com/article/css-floats-101, als ob Sie Positionierung in CSS verstehen, können Sie fast alles damit tun. Es ist ein sehr mächtiges Werkzeug, aber wenn Sie es nicht verstehen, kann es sehr frustrierend sein.

+0

Wow, das funktioniert super, danke! Also, wenn es Ihnen nichts ausmacht, was genau macht das und wie funktioniert es? Also ich weiß für die Zukunft. – IPlayTheTrumpet

+0

das ist eine ziemliche Aufgabe, um Ihre Follow-up-Frage zu beantworten, wenn Sie den Blogpost lesen, den ich verlinkt habe, denke ich, dass Sie verstehen, warum und was das Löschen des Floats tun. Es kann nicht in einem Kommentar beantwortet werden. –

0

Fügen Sie in Ihrer .footer Klasse in der CSS Datei die display: inline-block; hinzu und entfernen Sie die padding Eigenschaft.

.footer { 
display: inline-block; 
margin-top: 2%; 
} 

margin-top: 2%; ist nur ein Beispiel, einen beliebigen Wert setzen Sie wollen.