基于屏幕尺寸的页脚高度

我想创建一个与内容相关的页脚（因此不固定），但会填充屏幕的其余部分。举例来说，在我的大屏幕上，页脚会在同一个地方开始，但是会填充100px（例如）。在较小的显示器上，只需要填充75px。我尝试过使用100％，但它会导致页面变得非常大，用户可以向下滚动并使用页脚填充整个屏幕。有没有办法让它的尺寸更合理一些，这样它就能填满屏幕的底部？我当前的代码是这样的：基于屏幕尺寸的页脚高度

.footer 
{ 
    position:relative; //can't be fixed as content might overlap if extended  
    height:100%; 
    width:100%; //fill the entire screen horizontally 
    bottom:0px; 
    margin-top:345px; //used to make sure content doesn't overlap 
}

感谢您的任何想法

来源

2010-05-09 o-logn

你知道如果你只是把内容放在你的页面上，你不必担心它下面的页脚......为什么人们担心页面看起来如果没有内容？如果没有内容，人们就不会在意第一眼就看到它。 – animuson 2010-05-09 04:01:29

对不起，我不明白？我确实有内容。低于这个内容我想要一个页脚。页脚在内容下面（高度变化）开始，并且必须到达底部（这样它不仅仅是页面中间的一个栏）。 – 2010-05-09 13:03:08

我用类似的东西，我发现要解决它，以确保设置身体和HTML最小高度的伎俩挣扎： 100％，然后有内容和所有其他divs等于100％。

html { 
    min-height: 100%; 
} 
body { 
    margin: 0; 
    padding: 0; 
    min-height: 100%; 
} 
#content { 
    min-height: 100%; 
}

来源

2010-05-09 20:27:31 adamwstl

基于屏幕尺寸的页脚高度

回答

相关问题