2010-05-15 60 views
1

你怎么会做这样的: http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-pageCSS:流体布局 - 页脚始终在底部,和流体中心

除了与流体中心(垂直拉伸,身高100%)?

+0

http://matthewjamestaylor.com/blog/bottom-footer-demo.htm为演示 – 2010-05-15 08:24:44

+0

你能更好的描述你想要什么呢?流体中心水平和垂直?垂直拉伸到内容的底部?什么高度100%? – mVChr 2010-05-19 19:20:14

+0

我想在页面中间的DIV允许使用宽度的一些元素:100% – 2010-05-23 04:36:30

回答

1

我会使用一个display:table;布局为身体或包装,并给中间行百分之百的高度。

像this.-

<body> 
<div> 
    <div id=head">head</div> 
</div> 
<div> 
    <div id=body">body</div> 
</div> 
<div id=head"> 
    <div id="foot">foot</div> 
</div> 
</body> 

用下面的CSS。

html, body 
{ 
    height:100%; 
} 
body 
{ 
    width:100%; 
    display:table; 
} 
body > div 
{ 
    display:table-row; 
} 
body > div > div 
{ 
    display:table-cell; 
} 
#body 
{ 
    height:100%; 
}