マージンの絶対幅を取得する（マージン：autoの問題）

Question

要素のマージンのうち、used valueを特定しようとしています。私が理解することは、これが.getComputedStyle()によって返されるべきであるということです。しかし、margin: auto;を使用すると、FireFoxとOperaは正しい値を返さないようです。 Firefoxは'0px'を返し、Operaは時折、'0px'を返すか、'auto'：

http://jsfiddle.net/8FXbZ/

私は親のコンテンツの幅、および子の合計幅を計算し、利益率を計算したものを使用することができます知っています（ESPE再び

http://jsfiddle.net/8FXbZ/1/

、値はおそらく「リバースエンジニアリング」ことができるが、それは比較的複雑になるだろう：しかし、親がフレキシボックスであるとき、私は主にケースを見ていますフレキシブルボックスにラッピングが許可されている場合）、他の人の考えがあるかどうか疑問に思っていましたか？

Answer 1

Firefoxにバグがあります：https://bugzilla.mozilla.org/show_bug.cgi?id=381328が間違った値を返します。

Answer 2

私はこれがあなたが探している答えではないことを知っています。バグを考えると、ここではポリ充満があり、私は左右のマージンを計算し始めました。 FIDDLE

function getMargin(elem) { 
    var parent = elem.parentNode, 
    prev = elem, 
    next = elem, 
    leftEdge, 
    rightEdge; 

    var pos = elem.getBoundingClientRect(); 
    var parentPos = parent.getBoundingClientRect(); 
    var parentComputed = window.getComputedStyle(parent); 
    while((prev = prev.previousSibling) && !prev.getBoundingClientRect){} 
    while((next = next.nextSibling) && !next.getBoundingClientRect){} 
    if(prev) 
    leftEdge = prev.getBoundingClientRect().right; //+ getMargin(prev).right 
    else { 
    leftEdge = parentPos.left + parseInt(parentComputed.getPropertyValue("padding-left")) + parseInt(parentComputed.getPropertyValue("border-left-width")) 
    } 
    if(next) 
    rightEdge = next.getBoundingClientRect().left; //- getMargin(next).left; 
    else { 
    rightEdge = parentPos.right - parseInt(parentComputed.getPropertyValue("padding-right")) - parseInt(parentComputed.getPropertyValue("border-right-width")) 

    } 

    return { 
    left: pos.left - leftEdge, 
    right: rightEdge - pos.right 
    } 
} 

1つのキャッチがあり、あなたがのためにマージンを計算しようとしている要素の間に空の<span></span>タグ周器を挿入する必要があります。空のタグ（0の幅と高さがありますが、可視です）でもかまいません。

<div id="parent"> 
    <div id="inner"></div> 
    <span></span> 
    <div id="other"></div> 
</div> 

あなたはが右ボックスのはを左に必要となるボックスを残したような円形の無限ループに実行しますデバイダspanタグを削除し、以前と次の要素のマージンを計算するために再帰を使用した場合余裕の値と右ボックスにはが残りますボックスの右余白の値。