1

I'm trying to make a layout in which total minimal height would be 100% (if site would be longer, the footer should go down along with it). Header and footer should have 100% width.

http://jsfiddle.net/MXrY2/2/

This is what I came up with (a bit changed example from cssgirl.com), I only need this page to be 100% height at start (and go down if there's more content).

Any ideas how to achieve that?

jdl
  • 17,702
  • 4
  • 51
  • 54
Marcin
  • 505
  • 8
  • 20
  • possible duplicate of [CSS to make HTML page footer stay at bottom of the page with a minimum height](http://stackoverflow.com/questions/643879/css-to-make-html-page-footer-stay-at-bottom-of-the-page-with-a-minimum-height) – Chris Van Opstal Nov 19 '11 at 20:25

2 Answers2

2

The answer from this question applies here. Specifically, see the steps outlined here.

Community
  • 1
  • 1
linqq
  • 3,067
  • 2
  • 19
  • 17
  • Well, thank you. After playing a while with this solution I finally managed to do what I wanted - http://jsfiddle.net/dGBPf/ – Marcin Nov 20 '11 at 16:28
0

If you have 3 divs header content footer set the min-height of content div to be 100% so thats its height is always 100% long if content is longer

pahnin
  • 5,367
  • 12
  • 40
  • 57
  • This will push the footer and the lower part of the content off the bottom of the page. – Bojangles Nov 19 '11 at 20:16
  • yes I guess that's how @Marcin wants it to be.. see the question: _*if site would be longer, the footer should go down along with it*_ – pahnin Nov 19 '11 at 20:22
  • I think the OP wants the entire layout (including footer and header) to, at minimum, be 100% height so there is never a gap under the footer. – Bojangles Nov 19 '11 at 21:10