css - IE6 表单/div float 问题

标签 css internet-explorer internet-explorer-6 css-float

在使用 IE6 时遇到了一些棘手的问题并阅读了我的 div 表单布局,html:

<form id="brochureForm" name="brochureForm" action="/how-it-works/request-a-brochure/" method="post">
        <div class="row">
            <div class="label">
                <label for="szName">Name</label>
            </div>
            <div class="field">
                <input type="text" name="szName" id="szName" value="#form.szName#" />
            </div>
            <div class="clear"></div>
        </div>
        <div class="row">
            <div class="label">
                <label for="szCompanyName">Company Name</label>
            </div>
            <div class="field">
                <input type="text" name="szCompanyName" id="szCompanyName" value="#form.szCompanyName#" />
            </div>
            <div class="clear"></div>
        </div>
        <div class="row">
            <div class="label">
                <label for="szAddress">Address</label>
            </div>
            <div class="field">
                <input type="text" name="szAddress" id="szAddress" value="#form.szAddress#" />
            </div>
            <div class="clear"></div>
        </div>
        <div class="row">
            <div class="label">
                <label for="szTown">Town/City</label>
            </div>
            <div class="field">
                <input type="text" name="szTown" id="szTown" value="#form.szTown#" />
            </div>
            <div class="clear"></div>
        </div>
        <div class="row">
            <div class="label">
                <label for="szPostcode">Postcode</label>
            </div>
            <div class="field">
                <input type="text" name="szPostcode" id="szPostcode" value="#form.szPostcode#" />
            </div>
            <div class="clear"></div>
        </div>
        <div class="row">
            <div class="label">
                <label for="szTelephone">Tel</label>
            </div>
            <div class="field">
                <input type="text" name="szTelephone" id="szTelephone" value="#form.szTelephone#" />
            </div>
            <div class="clear"></div>
        </div>
        <div class="row">
            <div class="label">
                <label for="szEmail">E-mail</label>
            </div>
            <div class="field">
                <input type="text" name="szEmail" id="szEmail" value="#form.szEmail#" />
            </div>
            <div class="clear"></div>
        </div>
        <div class="submitrow">
            <input type="image" name="szSubmit" id="szSubmit" src="/images/form/submit.gif" class="submitRO" />
        </div>
    </form>

然后是 CSS:

.row {width:314px;margin:0 0 8px 0;}
.row .label {width:103px;padding:3px 16px 0 0;float:left;text-align:right;}
.row .field {width:195px;float:left;}
.submitrow {width:314px;text-align:right;padding:3px 0 0 0;}

在 IE8/7、Firefox 等中工作正常

最佳答案

此外,作为处理 IE6 时的经验法则,请尝试将 display:inline 添加到您的 float div

关于css - IE6 表单/div float 问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3247533/

相关文章:

javascript - jQuery .children() 在 ie6 中不起作用

html - 源代码超过 10k 行时 IE6 性能问题

Javascript .replace() 相同的字符不同的结果

jquery - 使用绝对位置动画在单击时隐藏和显示 div,并在隐藏时删除它们

javascript - 将所有 IE6 更新到 IE8?

javascript - 有没有办法让 IE 在内容更新时自动重新加载选项卡?

html - 表格 css 格式

html - React.Js/ typescript : How can I pass colors through props?

javascript - 拦截页面退出事件

html - 如何使用 Grid 960 和自定义样式修复 IE6 中的 CSS 布局问题