0

私はこの要素を含むページを持っています:

<body>
    <div class="C2">
        <div class="Ban">
            <div class="blockWithLabel position BankCode">
                <span>BankCode</span>
                <br />
                <input type="text"/>
            </div>
            <div class="blockWithLabel position BranchCode">
                <span>BranchCode</span>
                <br />
                <input type="text" style="width:500px"/>
            </div>
            <div class="blockWithLabel position AccountNumber">
                <span>AccountNumber</span>
                <br />
                <input type="text"/>
            </div>
            <div class="blockWithLabel position CheckDigits">
                <span>CheckDigits</span>
                <br />
                <input type="text"/>
            </div>
            <div class="blockWithLabel position BankName">
                <span>BankName</span>
                <br />
                <input type="text"/>
            </div>
            <div class="position validator">
                <div class="validator">VALIDATOR</div>
            </div>
        </div>
    </div>
</body>

このスタイルを適用したい:

        .Ban { overflow:hidden }
    div.blockWithLabel { display:inline-table; overflow:none; }

    .C2 { background-color: blue; }
    .C2 div.blockWithLabel { background-color:yellow; margin:2px;}
    .C2 div.position { float:left}

すべてのブラウザで、(画面の幅が十分に大きい場合)同じ行に6つの要素があります

今、使って休憩したい

.C2 div.position.AccountNumber, .C2 div.position.validator { clear:left }

問題は、IE7では、AccountNumberが新しい行に表示されますが、次の要素CheckDigitとBankNameが同じ行ではなく、前の行に表示されることです。

どうすれば修正できますか?

4

1 に答える 1

1

IE7 の条件付きコメントを使用する

<!--[if lte IE 7]>
<style type="text/css">
    /* hide other layout for other browsers by 
       setting display to none 
    */
    .C2 {
        display:none;
    }
</style>
Use ie7 formatting here with tables instead of divs.
<table>
    <TR>
        <T...................
<![endif]-->
于 2013-01-16T09:01:05.030 に答える