1

要素を水平方向に表示するページを設定する方法に関するチュートリアルを行いましたが、FF と Chrome では正常に動作しますが、IE8 では動作しません。

FF と Chrome では要素を水平方向にレンダリングし、IE8 では垂直方向にレンダリングします。「box-orient: horizo​​ntal」で IE8 用のレイアウトが設定されると思います。

IE8 が多くの HTML5 および CSS3 機能をサポートしていないことは知っていますが、このブラウザーで PIE を使用して角の丸いボックスを表示したことがあります。要素を水平方向に表示するなどの基本的な機能は、IE8 でサポートされると思います。

#box-wrap-inner {
    display: -webkit-box;
    display: -moz-box;
    display: box;

    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    box-orient: horizontal;

    -webkit-box-align: center;
    -moz-box-align: center;
    box-align: center;

    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    box-direction: normal;

    -webkit-box-pack: center;
    -moz-box-pack: center;
    box-pack: center;

}

#box1 {
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    box-flex: 0;

    -webkit-box-ordinal-group: 1;
    -moz-box-ordinal-group: 1;
    box-ordinal-group: 1;
}

#box2 {
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    box-flex: 0;

    -webkit-box-ordinal-group: 2;
    -moz-box-ordinal-group: 2;
    box-ordinal-group: 2;
}

#box3 {
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    box-flex: 0;

    -webkit-box-ordinal-group: 3;
    -moz-box-ordinal-group: 3;
    box-ordinal-group: 3;
}
4

3 に答える 3

3

flexbox モジュールはかなり新しく、IE8 と IE9 ではサポートされていません (IE10 では、この仕様の古いバージョンのみが prefix でサポートされています) -ms、PIE でシミュレートすることはできません。 Internet Explorer では壊れているという事実 (これは通常悪いことです - 彼らの市場シェアはまだかなり高いです)。

サポートチャート

IE で動作させるためのshim が用意されています。一般に、新しい HTML5/CSS の一部で問題が発生した場合は、このサイトが非常に役立ちます: Modernizr Polyfill List。

編集：

現在、推奨候補の状態になっているため、ブラウザですぐに安定して使用できるようになると期待できます。FF21 は既にプレフィックスを削除し、IE10 は win7 で使用できるようになったため、このモジュールを実際に使用し始めることができます。

于 2012-12-07T13:50:40.707 に答える
0

新しい良さはどれも機能しません。つまり、特定のスタイルシートを使用して、要素をフロートさせます。

<!--[if lt IE 9]><style> /** css to make ie8 play nicely **/ </style> <![endif]-->

あなたのスタイルを見ずに、私はあなたに具体的に何をすべきかを言うことができません...しかしそれは試みられたそして本当の方法です。フロートをクリアすることを忘れないでください！

于 2012-12-07T13:56:38.577 に答える
0

MDN のドキュメントによると:

Internet Explorer 10 と Safari は、仕様の互換性のない古いドラフト バージョンをサポートしています。最終バージョンをサポートするように更新されていません。

IE10 でまだ正しく処理されていない場合、IE8 でそれを行うことはできません。

于 2012-12-07T13:51:53.263 に答える