6

IE7で入力がコンテナから抜け出すのはなぜですか？

http://jsfiddle.net/Q8jPM/2/

ここに画像の説明を入力してください

<div class="row-fluid" style="margin-top:10px;">
    <div class="span12">
        <div class="row-fluid">
            <div class="span6">
                <div class="row-fluid">
                    <div class="span6 " style="background:green;">
                        <input type="text" class="span12">
                    </div>
                    <div class="span6" style="background:blue;">
                        <input type="text" class="span12">
                    </div>
                </div>
            </div>
            <div class="span6">
                <div class="row-fluid">
                    <div class="span6" style="background:green;">
                        <input type="text" class="span12">
                    </div>
                    <div class="span6" style="background:blue;">
                        <input type="text" class="span12">
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

</ p>

更新：ボックスモデルと幅の問題だと思いますが、ブートストラップを使用した解決策はありますか？

4

2 に答える 2

7

これは、IE7がcssプロパティをサポートしていないために発生します

box-sizing: border-box;

これは、要素の幅の一部としてパディングと境界線のサイズを考慮します。

このプロパティの詳細については、http：//paulirish.com/2012/box-sizing-border-box-ftw/をご覧ください。

このため、IE7は入力幅にパディングと境界線のサイズを追加します-親の幅を超えます。要素を親のサイズに合わせて流動性を保つには、これらを0に設定する必要があります。

入力の周りにラッパー要素を追加してから、ラッパーにパディングとボーダーを設定してみてください。これはすべてのブラウザで機能します

于 2012-10-10T09:42:38.580 に答える
0

私も同様の問題を抱えていました。交換して解決しました

class="span3"

と

class="input-mini"

あなたはinput-smallまたはもちろんそれに合うものなら何でも使うことができます。入力用のspan12を探していたので、「input-xxlarge」をお勧めします

于 2013-10-11T09:49:00.817 に答える