Question

我在页面中有这个结构

    <div style="float: right">
        <div>
            <label>
                Test type</label>
            <select id="selTest1">
            </select>
        </div>
        <div>
            <label>
                Test category</label>
            <select id="selTestCat">
                <option value="0">--Please Select--</option>
            </select>
        </div>


        <div style="text-align: right; width: 100%;">
            <a style="margin-right:0px;" href="Nothing.aspx" class="button" id="btnTest">Select</a>
        </div>

        <div>
            <input id="hdTest1" runat="server" type="hidden" />
            <input id="hdnTest2" runat="server" type="hidden" />
        </div>
    </div>

IE7中的所有内容都已正确对齐除了

<div style="text-align: right; width: 100%;">
    <a style="margin-right:0px;" href="Nothing.aspx" class="button" id="btnTest">Select</a>
</div>

在IE8和其他浏览器中，此div也占据整个宽度，按钮与右侧对齐。但在IE7中，按钮的div只占用按钮的宽度。

Answer 1

尝试将display：inline应用于您的按钮。我在下面为你完成了，看它是否有效：

 <div style="float: right">
        <div>
            <label>
                Test type</label>
            <select id="selTest1">
            </select>
        </div>
        <div>
            <label>
                Test category</label>
            <select id="selTestCat">
                <option value="0">--Please Select--</option>
            </select>
        </div>


        <div style="text-align: right; width: 100%;">
            <a style="margin-right:0px; display:inline;" href="Nothing.aspx" class="button" id="btnTest">Select</a>
        </div>

        <div>
            <input id="hdTest1" runat="server" type="hidden" />
            <input id="hdnTest2" runat="server" type="hidden" />
        </div>
    </div>

在IE 7中，子div不占用全宽

1 个答案: