css - IE7 表单放在单列而不是双列

Question

好的，我不知道它是如何附加的，这种形式：http: //xquives.kiiaistudio.com/new-form/index.php有一个两列字段。但在 IE7 中它在一列中，但不在 ie8 或 9 或 FF 中。你能告诉我我做了什么坏事，或者如何让 IE 表现得像普通浏览器一样。我已经进行了超过 2 小时的测试......而且我不知道去哪里找！

Answer 1

你的标记不适合蹩脚的ie7。您的标记通常如下所示：

<ul>
<li style="float:left width:50%">stuff</li>
<li style="float:left width:50%">stuff</li>
<li style="float:left width:50%">stuff</li>
<li style="float:left width:50%">stuff</li>
<li style="float:left width:50%">stuff</li>
</ul>

这很容易出错。

使用像这样驱动列的父容器会更好：

<div style="width: 50%; float: left">
    <ul>
    <li class="left-column-lis">stuff</li>
    <li class="left-column-lis">stuff</li>
    <li class="left-column-lis">stuff</li>    
    <li class="left-column-lis">stuff</li>
    </ul>
</div>
<div style="width: 50%; float: left">
    <ul>
    <li class="right-column-lis">stuff</li>
    <li class="right-column-lis">stuff</li>
    <li class="right-column-lis">stuff</li>    
    <li class="right-column-lis">stuff</li>
    </ul>
</div>

编辑：如果你嫁给了这个标记结构，你可以通过添加以下内容来破解 ie7：

UL{*overflow:visible;}
.autocolumn LI {*width: 48%;}

最好的办法是按照我上面描述的方式布局你的列