0

li タグ内の複数の行にまたがる可能性のあるテキストを垂直方向に配置するための、最もクロス ブラウザーのソリューションを見つけようとしています。例を次に示します。

OK 整列

私はこのトピックについて多くのことを読み、いくつかのスレッドに基づいて、次のフィドルhttp://jsfiddle.net/xRC3y/15/にあるコードを組み立てました。これはほとんどのブラウザーで機能しますが、IE で開発者ツールを介して quirks モードでプッシュすると、次のようにレンダリングされます。

位置合わせが悪い

IE quirks モードでも機能するソリューションを取得するのに苦労しています。

4

1 に答える 1

1

最近、同様の問題がありました。この問題にはもっと洗練された解決策があるかもしれませんが、私が問題を解決した方法は、Javascript/jQuery を使用して条件付きで要素のスタイルを設定することでした。残念ながら、これには HTML マークアップを変更して、中央に配置する要素にクラス .vCenterIE7 (またはその他) を追加し、要素を中央に配置する要素に別のクラス .vCenterIE7Rel を追加する必要があります。

また、これはユーザーが IE7 を使用しているかどうかを検出するための完全に信頼できる方法ではないこともわかっています (modernizr の方が信頼性が高いです)。

脚本：

function vCenterIE7() {
if (navigator.userAgent.toLowerCase().indexOf('msie 7') > -1) {
    var els = $('.vCenterIE7');
    for (var i = 0; i < els.length; i++) {
            var c = els.eq(i);
            var b = c.closest('.vCenterIE7Rel');
            var mtop = b.height() / 2;
            mtop -= c.height() / 2;
            c.css('margin-top',mtop);
    }
}
}
于 2012-10-17T14:03:40.203 に答える