diff --git a/lib/lost-offset.js b/lib/lost-offset.js index 39ccadee..12eb58e8 100644 --- a/lib/lost-offset.js +++ b/lib/lost-offset.js @@ -111,15 +111,15 @@ module.exports = function lostOffsetDecl(css, settings) { } else if (lostOffsetNumerator > 0) { if (lostOffsetGutter !== '0') { decl.cloneBefore({ - prop: 'margin-right', - value: 'calc(99.9% * ' - + lostOffset + ' - (' + lostOffsetGutter + ' - ' - + lostOffsetGutter + ' * ' + lostOffset + ') + (' - + lostOffsetGutter + ' * 2)) !important' + prop: 'margin-left', + value: 'calc(99.9% * (-' + + lostOffset + ' * -1) - (' + lostOffsetGutter + ' - ' + + lostOffsetGutter + ' * (-' + lostOffset + ' * -1)) + ' + + lostOffsetGutter + ') !important' }); } else { decl.cloneBefore({ - prop: 'margin-right', + prop: 'margin-left', value: 'calc(99.999999% * ' + lostOffset + ') !important' }); } @@ -127,9 +127,9 @@ module.exports = function lostOffsetDecl(css, settings) { if (lostOffsetGutter !== '0') { decl.cloneBefore({ prop: 'margin-left', - value: 'calc(99.9% * (' - + lostOffset + ' * -1) - (' + lostOffsetGutter + ' - ' - + lostOffsetGutter + ' * (' + lostOffset + ' * -1)) + ' + value: 'calc(99.9% * ' + + lostOffset + ' - (' + lostOffsetGutter + ' - ' + + lostOffsetGutter + ' * ' + lostOffset + ') + ' + lostOffsetGutter + ') !important' }); } else { diff --git a/test/lost-offset.js b/test/lost-offset.js index 2c8c9255..e2eb90a8 100644 --- a/test/lost-offset.js +++ b/test/lost-offset.js @@ -6,7 +6,7 @@ describe('lost-offset', function() { it('moves element to the left', function() { check( 'a { lost-offset: 1/3; }', - 'a { margin-right: calc(99.9% * 1/3 - (30px - 30px * 1/3) + (30px * 2)' + + 'a { margin-left: calc(99.9% * (-1/3 * -1) - (30px - 30px * (-1/3 * -1)) + 30px' + ') !important; }' ); }); @@ -14,8 +14,8 @@ describe('lost-offset', function() { it('moves element to the right', function() { check( 'a { lost-offset: -1/3; }', - 'a { margin-left: calc(99.9% * (-1/3 * -1) - (30px - 30px * ' + - '(-1/3 * -1)) + 30px) !important; }' + 'a { margin-left: calc(99.9% * -1/3 - (30px - 30px * ' + + '-1/3) + 30px) !important; }' ); }); @@ -38,8 +38,8 @@ describe('lost-offset', function() { it('supports custom gutter', function() { check( 'a { lost-offset: 1/2 row 60px; }', - 'a { margin-right: calc(99.9% * 1/2 - (60px - 60px * 1/2) + ' + - '(60px * 2)) !important; }' + 'a { margin-left: calc(99.9% * (-1/2 * -1) - (60px - 60px * (-1/2 * -1)) + ' + + '60px) !important; }' ); }); });