开发者

Getting 960 grid layout to 100% height

I'm working on a layout using the 960 CSS grid layout and having some trouble getting my content div to stretch all the way to t开发者_如何学运维he bottom, no matter how much content there is.

I have height: 100% on both html and body tags. Usually a min-height: 100% on the content div would work but that does not seem to be the case with the 960 grid.

Any ideas?


Not sure if this answer is still needing to be answered, but I ran into the same problem today working on a wordpress template and solved the problem.

What you have to do is make a wrapper before the container_12 or container_16 that is provided by the grid. You don't need html or body equaling height: 100% at all. You don't even need a min-height on the wrapper.

Make sure that your wrapper doesn't have a height or width set, and put the clearfix on container_12 or container_16 and it should expand all the way down.

I have this working on my wordpress template.

  <div id="yourwrapper">
    <div class="container_12 clearfix">
      <div class="grid_12">

       <!-- YOUR CONTENT SHOULD BE COMPLETELY WRAPPED BY THE WRAPPER -->          

      </div>
      </div>
      </div>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜