开发者

facebook style layout question

I am trying to emulate this simple layout :

_______________________________________
|____header___________________________|
     |                           |
     |                           | 
     | Blueprint Container       | 
     |                           | 
     |                           |
     |                           |
     |                           |
     |                           |
_____|___________________________|_____
|__footer______________________________|

Where

  1. the header and f开发者_如何学运维ooter stretch across the width of the page
  2. header always stays at the top
  3. footer sticks to the bottom
  4. the blueprint container is a fixed width container and everything inside it is managed using blueprint.

What's the best to way to accomplished this. The challenge is my weak layout skills and understanding how to make the headers/footer fluid so that they always stretch but the container stays fixed.


I think the best way would be to use CSS. I have uploaded some samples at http://www.4shared.com/file/zk1Sv21F/Facebook-Style_Bar.html
Also take a look at http://ryanfait.com/sticky-footer/


You need to use position:fixed; width:100%; height:100px; for the top and bottom divs. For the central one: position:relative; margin:100px auto; width:1000px;.

0

上一篇:

下一篇:

精彩评论

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

最新问答

问答排行榜