Hallo Leute,
das ist mein erster Besuch in diesem Forum und ich habe auch gleich mal eine Frage, auf welche ich bisher leider keiner Antwort gefunden habe.
Ich habe ein responsives Design mit einem variablen Footer, der immer unten im Browser angezeigt wird. Ich habe mich hierbei für diese Version entschieden, da hier der Footer keine feste Höhe benötigt, was bei Responsive sehr angenehm ist.
Funktioniert auch alles ganz super - ABER:
Ich möchte einen Rahmen und um die Seite, dieser hört aber nach dem Content auf und fährt nicht bis zum Ende durch.
Wie bekomme ich das hin?
Hier der Quellcode
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<style>
*{ margin: 0; padding: 0; }
html,body{ height: 100%; }
body{ display: table; width:100%; }
.page-row{ display: table-row; height:1px; }
.page-row-expanded{ height: 100%; }
.grid{ width: 960px; position: relative; margin: 0 auto; padding: 0px; }
.rahmen{ border-left: 3px solid #000; border-right: 3px solid #000; }
.rahmen-top{ border-top: 3px solid #000; }
.abstand-top{ margin-top: 10px; }
#footer{ line-height: 2em; }
</style>
</head>
<body>
<div class="page-row page-row-expanded">
<div class="grid rahmen rahmen-top abstand-top">
Header
Content
</div>
</div>
<div class="page-row">
<div id="footer" class="rahmen-top">
Footer
</div>
</div>
</body>
</html>
Alles anzeigen
Ich komme einfach nicht dahinter. 
Mit fixer Höhe vom Footer würde es gehen, da es aber responsive sein soll, ist das nicht möglich, da sich die Größe des Inhaltes vom Footer immer ändert.
Hat jemand eine Idee?
Oder kennt vielleicht jemand eine andere Sticky-Footer-Lösung mit variabler Höhe?
Vielen Dank für eure Mühe und Hilfe im Voraus.
LG
Mario
