0

IEはいつか不可能だと私は知っています。floatを使用して、6つのdivを右側に配置しています。コードは次のとおりです：http：//jsfiddle.net/jcay3/1/。問題は、IEではバーの下にあり、そこに配置する必要があることです。

解決策はありますか？特にIEのコメントについて多くの開発者が話しているのを聞きました。彼らは問題を解決しますか？互換モード（IE9）で試してみました。IE 6で正しくレンダリングされ、IE 7で間違ってレンダリングされた場合はどうなりますか？IE 7専用の特別なコードを追加する必要がありますか？それともそのようなリスクはありませんか？

他に解決策はありますか？もっと簡単なもの？ありがとうございました

4

4 に答える 4

1

問題は img タグです。
それを取り除くと、div はそれらが属する場所になります。
可能であれば、img を div に入れます。

于 2012-06-19T20:06:32.593 に答える
1

互換モードの私見を信用すべきではありません。OS が IE9 の場合、それぞれに 1 つの異なる IE を持つ MS 仮想マシンのみが問題ありません。
私は、IE8-as-IE7 や IE Tester などで、存在しないバグを見てきました (私の同僚が見たエラーです)。

はい、それらは巨大ですが、存在しないバグをデバッグする何時間もの時間を節約できます。(古い) IE にはすでに十分な数の実際のバグがあります。;)

あなたの問題に関しては、IE6とIE7の両方に存在し、解決できますが、それがimg { float: left; }最善の解決策であるとは確信が持てません。

于 2012-06-19T20:07:35.600 に答える
0

IE コンディショナル タグが役立ちますが、IE のバグによる問題ではないと思います。

このバリエーションを試してください: http://jsfiddle.net/jcay3/5/

違いはoverflow: hidden、コンテナー.menuBarの であり、これにより、要素は浮動要素を自己クリアします。

また、境界線に対応するように高さを修正し、.menuBarContainer要素を 100% 幅に設定して、JSFiddle からオーバーフローしないようにしました。

私はこのマシンで IE を実行していませんが、これは少なくとも IE7 までは動作すると確信しています。間違っていたら教えてください。もう一度調べます。

于 2012-06-19T20:04:12.783 に答える
0

古いバージョンの Internet Explorer で適切に表示し、クロスブラウザーのサポートを向上させるには、反対の要素をフロートする必要があります。

この実用的なフィドルの例を参照してください!

このCSSを追加

.menuBar .menuBarContainer img {
    float: left;
}

また、浮動要素のみを含む要素は で折りたたまれることを考慮する必要があります。これはheight、子の浮動要素が通常のドキュメント フローに存在しなくなるためです。

これは、.menuBarContainerwill がないことを意味し、heightその後の要素に視覚的な問題が発生する可能性があります。clearこれを修正する最善の方法は、この要素を閉じる前にCSS を使用することです。

CSS

.clear {
    clear:both;
}

.menuBarContainerこれは、フロート要素が占めるスペースの後に willの下の境界線が来ることを意味し、.menuBarContainerその高さを保持して、通常のドキュメント フローを保証します。

補足として、</div>フィドルの例には追加の締めくくりがあります。

于 2012-06-19T20:08:44.080 に答える