0

我在 Firefox 中浮动字段时遇到了一个奇怪的问题。在 Chrome 和 Safari 中一切正常,但 Firefox 有其他意见 :) 其他字段都很好,但这个不想正确浮动。

问题在蓝色区域。

在这里你可以看到它是如何在 Chrome中正确浮动的

在这里你可以看到 火狐版本

看起来由于某种原因,这个蓝色字段从第二列开始浮动,而不是从行的开头。

这是我用于字段定位的 css。基本上,我将字段设置为 % 宽度并将它们彼此相邻浮动。

在这里我指定第一行字段

.deliver-week {width:35%;float:left;} 
.deliver-date-start {width:40%;float:left;} 
.get_delivery {width:23%;float:left;} 

这个是为这些蓝色和红色的字段

.deliver-or {clear:both!important;width:30%;float:left;text-align:right;}
.deliver-date-or {width:70%;float:left;text-align:center;}

这是第三排

.deliver-start {clear:both!important;width:35%;float:left;}
.deliver-day {width:40%;float:left;}
.deliver-date-day {width:23%;float:left;}

你能帮我解决这个问题吗?

4

1 回答 1

0

发生这种情况的原因是,Firefox 将选择框呈现为比 Chrome 更高的元素,并且蓝色文本的容器被select的容器元素捕获(因为它现在比其他元素低)

LI您可以通过在容器s上设置固定高度来解决此问题-height:80px;在我的测试中运行良好(前提是无论出于何种原因它们不应该是灵活的高度)

于 2013-08-12T10:52:00.030 回答