CSS页脚这在IE和Firefox

球员嗨的工作我想添加一个CSS页脚，但不能将其工作的权利。现在我正在调整它像疯了似的，如果它在Firefox似乎罚款它得到全乱了Internet Explorer 7中AHD有时是半山腰德页:(有没有什么很好的例子，在那里为基于CSS的页脚。CSS页脚这在IE和Firefox

考虑到我的网页有一个固定的宽度，不同高度的2列和我的页脚中有100％的宽度

嗯，我使用的CSS粘页脚是 - 它似乎很好地工作在firefox，但IE浏览器页脚浮动在页面的一半，我注意到我的页脚挂在浏览器视口高度的底部，我认为IE浏览器如何将高度解释为100％。罚款自己，但作为我pu我的修改和添加它在IE中搞砸了。页脚和头的基本代码是这样：

@charset "utf-8"; 
/* CSS Document */ 

html, body, #wrap {height: 100%;} 
body > #wrap > #main > #pageContent {height: auto !important; min-height: 100%;} 

#main 
{ 
    background-color:#FFFFFF; 
    width:960px; 
    height:100% !important; 
    text-align:left; 
    position:relative; 
} 

#footer 
{ 
    display:block; 
    width:100%; 
    text-align:center; 
    position: relative; 
    height: 150px; 
    clear:both; 

} 
/* CLEAR FIX*/ 
.clearfix:after 
{ 
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden; 
} 
.clearfix 
{ 
    display: inline-block; 
} 
/* Hides from IE-mac \*/ 
* html .clearfix { 
    height: 1%; 
} 
.clearfix 
{ 
    display: block; 
} 
/* End hide from IE-mac */

和HTML是有点像这个

<div id="wrap"> 
<div> header is here</div> 
<div id="main" class="clearfix">content is here </div> 
</div> 
<div id="footer"></div>

我在哪里搞乱它

来源

2009-04-19 Ali

我把它整理 - 因为某些原因出现了明确的两个实例：两者虽然我看不出这是造成问题，但去除多余项固定它：\那些怪异的解决方案，没有之一似乎有任何意义。无论如何，谢谢你们。

来源

2009-04-22 14:54:43 Ali

我想尝试的CSS Sticky Footer。

来源

2009-04-19 05:59:55

非常有用，谢谢！修复了IE和Firefox的麻烦。 – Desmond 2014-03-24 16:42:36

不能说没有看到代码，但有两点栏布局，你可能至少有一列浮动。在页脚中放置style =“clear：both”应该强制它到页面的底部。

来源

2009-04-19 06:18:43 allclaws

这取决于你想达到什么样的，我想。第一个建议我是用：

#footer {clear: both; 
     }

这将，至少，推低最长列的页脚，假定有不止一个。

第二个建议，我的首选解决方案（铭记我不知道跨浏览器/操作系统的兼容性），是：

#footer {position: absolute; 
     bottom: 0; 
     left: 0; 
     right: 0; 
     }

这是不言自明，但本质上附着的页脚到页面的底部，并允许#footer根据其内容进行调整，也这意味着#footer将宽为100％（允许有像素），所以根据你的设计调整。

来源

2009-04-19 06:31:23

CSS页脚这在IE和Firefox

回答

相关问题