CSS: Correct misrepresentation of "auto" horizontal margins as 0

Fixes gh-2237
Closes gh-2276

(cherry picked from commit 214e1634ab)

Conflicts:
	src/css.js
	src/css/support.js
	test/unit/support.js
This commit is contained in:
Richard Gibson
2015-05-07 23:16:18 -04:00
parent c752a5030b
commit 487d5ca913
6 changed files with 100 additions and 47 deletions

View File

@@ -350,6 +350,19 @@ jQuery.each( [ "height", "width" ], function( i, name ) {
};
} );
jQuery.cssHooks.marginLeft = addGetHookIf( support.reliableMarginLeft,
function( elem, computed ) {
if ( computed ) {
return ( parseFloat( curCSS( elem, "marginLeft" ) ) ||
elem.getBoundingClientRect().left -
swap( elem, { marginLeft: 0 }, function() {
return elem.getBoundingClientRect().left;
} )
) + "px";
}
}
);
// These hooks are used by animate to expand properties
jQuery.each( {
margin: "",

View File

@@ -6,7 +6,7 @@ define( [
], function( jQuery, document, documentElement, support ) {
( function() {
var pixelPositionVal, boxSizingReliableVal, pixelMarginRightVal,
var pixelPositionVal, boxSizingReliableVal, pixelMarginRightVal, reliableMarginLeftVal,
container = document.createElement( "div" ),
div = document.createElement( "div" );
@@ -30,16 +30,20 @@ define( [
function computeStyleTests() {
div.style.cssText =
"box-sizing:border-box;" +
"display:block;position:absolute;" +
"margin:0;margin-top:1%;margin-right:50%;" +
"border:1px;padding:1px;" +
"top:1%;width:50%;height:4px";
"position:relative;display:block;" +
"margin:auto;border:1px;padding:1px;" +
"top:1%;width:50%";
div.innerHTML = "";
documentElement.appendChild( container );
var divStyle = window.getComputedStyle( div );
pixelPositionVal = divStyle.top !== "1%";
boxSizingReliableVal = divStyle.height === "4px";
reliableMarginLeftVal = divStyle.marginLeft === "2px";
boxSizingReliableVal = divStyle.width === "4px";
// Support: Android 4.0 - 4.3 only
// Some styles come back with percentage values, even though they shouldn't
div.style.marginRight = "50%";
pixelMarginRightVal = divStyle.marginRight === "4px";
documentElement.removeChild( container );
@@ -69,6 +73,14 @@ define( [
computeStyleTests();
}
return pixelMarginRightVal;
},
reliableMarginLeft: function() {
// Support: IE <=8 only, Android 4.0 - 4.3 only, Firefox <=3 - 37
if ( boxSizingReliableVal == null ) {
computeStyleTests();
}
return reliableMarginLeftVal;
}
} );
} )();