1

他のブラウザにはない FireFox レンダリングの問題があります。colResisable プラグインを介してサイズ変更可能なテーブル セルがあります。2 番目のセルには 2 つの div があり、1 つは順序付けられていないリストを含み、もう 1 つはテーブルを含みます。これらの div の内容が重要かどうかはわかりません。

これらの div はどちらもインライン ブロックとしてスタイル設定されています。親は、2 番目のインライン ブロックが最初のインライン ブロックの下に落ちないように、空白をラップするようになりました。私の意図は、コンテンツがスクロールバーで親 TD をオーバーフローさせることです。

これは IE、Safari、および Chrome では正しく機能しますが、FireFox ではコンテンツが親の境界線の上に重なります。

違いを示す 2 つのスクリーンショットを次に示します。

これが Chrome でどのようにレンダリングされるか

これが FireFox でどのようにレンダリングされるか

この動作を近似するJSFiddleがありますが、まったく同じにはなりません。うまくいけば、誰かがこれを見て、何が起こっているのかを知るでしょう。

4

1 に答える 1

1

次のように変更できdisplay: inline-blockますfloat: left。

#content_1, #content_2 {
    ...
    float: left;
    ...
}

作業例: http://jsfiddle.net/xVNae/24/

続けたい場合は、 for に変更してみてdisplay: inline-blockください:border-collapseinherittable

table {
    border-collapse: inherit;   
}

作業例: http://jsfiddle.net/xVNae/25/

于 2012-08-17T12:01:05.530 に答える