{"issue":{"created_at":"2011-09-25T22:50:21Z","state":"closed","updated_at":"2011-11-26T07:40:55Z","comments":12,"user":{"gravatar_id":"b9a9b8e38f4d50243520d09b47379822","id":208043,"url":"https://api.github.com/users/hugovincent","login":"hugovincent","avatar_url":"https://secure.gravatar.com/avatar/b9a9b8e38f4d50243520d09b47379822?d=https://a248.e.akamai.net/assets.github.com%2Fimages%2Fgravatars%2Fgravatar-140.png"},"body":"It'd be good if Bootstrap supported sticky footers (floats to bottom of page for pages shorter than the browser window). ","assignee":null,"id":1735547,"number":306,"pull_request":{"patch_url":null,"html_url":null,"diff_url":null},"labels":[],"title":"Sticky footer","closed_at":"2011-10-04T06:06:17Z","html_url":"https://github.com/twitter/bootstrap/issues/306","milestone":null,"url":"https://api.github.com/repos/twitter/bootstrap/issues/306"},"action":"created","comment":{"created_at":"2011-11-26T07:40:55Z","updated_at":"2011-11-26T07:40:55Z","user":{"gravatar_id":"07d2448de26d55339f57153d303a4609","id":200159,"url":"https://api.github.com/users/dteoh","login":"dteoh","avatar_url":"https://secure.gravatar.com/avatar/07d2448de26d55339f57153d303a4609?d=https://a248.e.akamai.net/assets.github.com%2Fimages%2Fgravatars%2Fgravatar-140.png"},"body":"I used a combination of the technique found in http://jsdo.it/Bakey/bootstrap-sticky-footer and http://ryanfait.com/resources/footer-stick-to-bottom-of-page/.\r\n\r\nFor my html/haml I had something like:\r\n\r\n    %body\r\n      .topbar\r\n      .main\r\n        .container\r\n          # content here\r\n          .push\r\n    %footer.footer\r\n\r\nFor the scss it was:\r\n\r\n    html, body {\r\n        height: 100%;\r\n    }\r\n    .main {\r\n        min-height: 100%;\r\n        height: auto !important;\r\n        height: 100%;\r\n        margin: 0 auto -1*($topbar-height + $footer-height - 10px);\r\n    }\r\n    .main > .container {\r\n        padding-top: $topbar-height;\r\n    }\r\n    footer.footer {\r\n        height: $footer-height;\r\n        background: #eee;\r\n    }\r\n    .push {\r\n        height: $footer-height + $topbar-height;\r\n    }\r\n\r\nI think the topbar made this a pain to implement because of the $topbar-height padding. I also have a trial-and-error 10px in the margin calculation of the .main style.\r\n\r\nIt would be really nice to get an official or clean implementation that works with and without the topbar.","id":2880409,"url":"https://api.github.com/repos/twitter/bootstrap/issues/comments/2880409"}}