Auf deiner Grafik erkenne ich die falschen Höhen, öffne ich die Seite, sehe ich sie nicht.
Aber was mir auffällt: Die Seite ist nicht sonderlich gut geschrieben, da wundert es mich nicht, dass Probleme auftreten.
main{margin:7.5px 5px} <-- Was soll ein halber Pixel denn zB sein?
Auch der Aufbau lässt sich noch verbessern.
Code:
<main>
<div class="nav" />
<div class="nav" style="float:right" />
<div id="bilder" />
</main>
Baust du deinen Inhaltsbereich so auf, brauchst du für #bilder keine feste Breite angeben.
(float:right) ist jetzt hier nur deshalb als inline-style angegeben damit du leichter siehst, was du im CSS ändern musst.
Du verwendest zwar schön die neuen HTML5 Elemente, aber die "alten", seit mehreren Jahren existente Elemente wie Überschriften, Listen, etc. setzt du so gut wie nicht ein.
Ist "Kategorie" in der linken Spalte keine Überschrift? Oder wieso wird das als Absatz eingebunden?
Gehört das Facebook/Twitter Bild nicht zum Text "Teilen:"? Wenn doch, warum sind die Bilder dann nicht im Absatz vorhanden?
Warum sind die Aufzählungen im Footer nicht in einer Liste?
Hier gibt es also noch genug zu tun und wenn alles sauber umgesetzt ist (auch mit korrekten margin-Werten), dann solltest du keine Probleme mehr haben.