奇怪的Firefox溢出/浮动行为

html
css

2010-07-13 99 views 3 likes

我有一个simple layout，它在Chrome，Safari甚至Opera（OS X）中都能正常工作。我在这里的惊喜是Firefox。（IE和Win尚未测试）。奇怪的Firefox溢出/浮动行为

问题是fieldset.ownerbox未在Firefox中浮动。（饼图下面的两个半透明的字段集）

CSS规则应用在这里：

#owners { 
position: relative; 
width: 940px; 
left: 0px; 
margin-left: 0px; 
z-index: 1; 
top: -240px; 
font-size: 16px; 
} 
.ownerbox { 
width: 310px; 
height: 150px; 
padding: 10px; 
margin-right: 20px; 
float: left; 
background: rgba(255,255,255,0.5); 
color: #000; 
border-radius: 10px; 
-webkit-border-radius: 10px; 
-moz-border-radius: 10px; 
} 
.ownerbox.large { 
width: 500px; 
padding: 0px 10px 20px 10px; 
}

请帮帮忙，有什么错我的做法？

来源

2010-07-13 fabrik

回答

重新调整宽度，以便将填充考虑在内。你可以overflow-x:hidden;#owners看看它是如何看起来“包含”。

或者调整#owners的宽度。

编辑：似乎你只需要clear:both在#owners。

来源

2010-07-13 14:26:12

当我设置溢出：自动;在#owners上Firefox除了顶部和底部的饼图剪辑之外正确地呈现布局。 – fabrik 2010-07-13 14:30:50

上面的浮动列表#owners做了这个??谢谢！ – fabrik 2010-07-13 14:33:06

你不应该使用'top：-240px'和'position：relative'。我认为你需要调整你的布局，不要太依赖相对定位。如果你有很多这样的情况，这是一个不好的迹象，通常意味着回去，杀死位置亲属，并找到另一种布局方式。 – 2010-07-13 14:33:30

奇怪的Firefox溢出/浮动行为

回答

相关问题