IE11の条件付きコメントスクリプト不可解決？

Question

ウェブサイトを作成しながら（queenalright.co.uk）私はIEの中心的な固定されたDIVの問題を抱えていました。私が反応的なレイアウトを作成しようとしていたのでこれはより困難になりました。IEのターゲットバージョンからターゲットバージョンに呼ばれるスクリプトを使用してこれを解決しました。それ以来、IE11がリリースされており（その中では前方思考の中で）条件付きコメントを削除しましたが、固定または絶対DIV要素を中心としたサポートが追加されていません。

問題を解決するための最良のアプローチ、あるいはこれについての全体的な方法は私が知りませんか？

これはスクリプトです：

// script to achieve horizontal centering in internet exporer! Grrrrr!

function topSize() {


    // get screen width
    var screenWidth = $(window).width();

    // resize
    var halfScreenWidth = screenWidth/2;
    var topWidth = $('#top').width();
    var topBGWidth = $('#top-bg').width();
    var minusMarginInner = (-1)*(topWidth/2);
    var minusMarginBG = (-1)*(topBGWidth/2);


    $('#top').css({
        "left":"50%",
        "right":"auto",  // overwrites the right 1% property previously used for centering
        "margin-left":minusMarginInner + "px"
    });

    $('#top-bg').css({
        "left":"50%",
        "right":"0",  // overwrites the right 1% property previously used for centering
        "margin-left":minusMarginBG + "px"
    });

}


$(document).ready(function() {
var screenWidth = $(window).width();
if (screenWidth >= 1096) {
    topSize();
}
}); // document ready test window size and run topsize function

$(window).resize(function() {
var screenWidth = $(window).width();
if (screenWidth >= 1096) {
    topSize();
}
}); // window resize test window size and run topsize function

.

Answer 1

あなたが自分でIEを狙う方法を尋ねるならば、あなたはおそらく休憩を取ってあなたが服用しているアプローチを再考するのが好きです。Internet Explorerは、絶対に/固定された要素だけでなく、他のブラウザを中央にすることができます。この特定のケースでは、あなたが取ったアプローチは最もクロスブラウザ互換性ではありませんでした。代替案を提案するかもしれません。

.center {
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
}

.

このアプローチは、最近のすべてのブラウザでも同じように機能し、一貫した経験を与えます。私はこれを示す小さなデモフィドルを作成しました： http://jsfiddle.net/rx2jb/show/qu 。