Question

这是我的代码（非常简化）：

<div style="float: left;">
    <div style="float: left;">
        <!-- Some content -->
    </div>
    <div style="float: right;">
        <!-- Some content -->
    </div>
    <form method="post" style="display: block; width: 100%; position: relative;">
        <fieldset>
            <!-- Some content -->
        </fieldset>
    </form>
</div>

在IE8，FF3.6 / 4，Chrome和Opera中看起来不错。 Div没有指定宽度，我希望表单填充剩余空间。但在IE7中非浮动形式下降。我该怎么办？

您可以看到此on this site（顶部栏）

Answer 1

您是否有理由不想指定宽度？似乎他们的标题比必要的更冗长。下面会有什么东西为你做同样的事情？

<div style="float: left; width:100%;">
<div style=" display:block;float: left; position:relative; top:0; left:0; width:20%">
    <p>LEFT SIDE</p>
</div>
<div style="display: block; position: relative; float:left; top:0; left:0; width:60%;">
        <form method="post">
    <fieldset>
        form stuff
    </fieldset>
</form>
</div>
<div style="display: block; float: left; position:relative; top:0; left:0; width:20%;">
    <p>RIGHT SIDE</p>
</div>

这应该适用于IE，但CSS可能需要调整以补偿IE处理盒子模型的时间。

Answer 2

当您指定窗体具有100％宽度时，它将占用父窗口的整个宽度，在这种情况下，父窗口与浮动div的窗格相同。

您要么清除非浮动的宽度并保留其余部分或指定浮动的宽度并清除非浮动的宽度。

两个浮动元素之间的非浮动元素 - IE7

2 个答案: