css - 当我添加边框时,Firefox 是否会添加任何专有值(就像 IE 对 hasLayout 所做的那样)?

标签 css firefox cross-browser border

我有一个看起来像浏览器错误的布局问题。

它仅在 FF3 中出现(未测试 ff2)。

它只在页面第一次加载时显示。如果我调整窗口大小,它会正常运行。

当我在问题元素上添加边框时它消失了,当我取消边框时它又回来了。

其他属性没有变化。

这是问题的图片: footer width problem

Firebug 的 DOM 检查器认为页脚在这两种情况下都占据了整个宽度。似乎只有 text-align:center 没有正确地尊重整个宽度。 *更新:取消 text-align:center 并不能解决问题。文本与屏幕左侧齐平(正确)或紫色框(错误)。

您在屏幕上看到的 1px 紫色边框是 #centerHolder,它是另一个元素的子元素,应该不会影响页脚的布局,尽管它显然会影响。 *更新:将紫色框的高度缩小到 85%,它不可能挡路,根本不会改变问题。文本仍然认为紫色框挡住了路。

感谢您的意见和想法。

HTML:

<div id="container">
    <div id="centerHolder"></div>
</div>
<p id="footer">
    Copyright ©2009 Lala Corporation
    <a class="link" onclick="ContactUs_OnClick(); return false;" href="#">Contact Us</a>
</p>

CSS:

#container{
position:relative;
height:96%;
min-height:600px;
width:100%;
min-width:975px;
max-width:1300px;
margin:0 auto;
z-index:2;
}
#centerHolder {
float:left;
margin-left:245px;
width:10%;
z-index:1000;
}
#footer {
border:1px solid green;
margin:0;
padding-top:5px;
position:relative;
text-align:center;
z-index:1;
}

最佳答案

你需要 clear: both; 在你的 #footer 上,它不会清除你的 float div #centerHolder

关于css - 当我添加边框时,Firefox 是否会添加任何专有值(就像 IE 对 hasLayout 所做的那样)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1791068/

相关文章:

android - Android 版 Chrome 和桌面版 Chrome 之间有什么区别?

jquery - 为什么我的html文本不动?

css - 自定义字体在 Firefox 3.6 中不起作用!

javascript - 标签和点击事件 href ="javascript: my_function()"与 onclick ="my_function()"或

javascript - 为什么在 Firefox 中的文本区域中键入会导致屏幕滚动?

css - 转换持续时间在 Firefox 中不起作用

php - xhtml 的全页所见即所得编辑器?

html - 将相对定位的父 div 的高度扩展到绝对定位的子 div 的高度

jquery - ngRoute 在页面之间随机切换

CSS -> _属性 :value is for IE+ or only until IE6?