diff --git a/modules/ui/sidebar.js b/modules/ui/sidebar.js
index a25df48d2..dd1975cb6 100644
--- a/modules/ui/sidebar.js
+++ b/modules/ui/sidebar.js
@@ -68,6 +68,7 @@ export function uiSidebar(context) {
             })
             .on('drag', function() {
                 var isRTL = (textDirection === 'rtl');
+                var scaleX = isRTL ? 0 : 1;
                 var xMarginProperty = isRTL ? 'margin-right' : 'margin-left';
 
                 var x = d3_event.x - dragOffset;
@@ -84,7 +85,7 @@ export function uiSidebar(context) {
                             .style(xMarginProperty, '-400px')
                             .style('width', '400px');
 
-                        context.ui().onResize([sidebarWidth - d3_event.dx, 0]);
+                        context.ui().onResize([(sidebarWidth - d3_event.dx) * scaleX, 0]);
                     }
 
                 } else {
@@ -94,9 +95,9 @@ export function uiSidebar(context) {
                         .style('width', widthPct + '%');
 
                     if (isCollapsed) {
-                        context.ui().onResize([-sidebarWidth, 0]);
+                        context.ui().onResize([-sidebarWidth * scaleX, 0]);
                     } else {
-                        context.ui().onResize([-d3_event.dx, 0]);
+                        context.ui().onResize([-d3_event.dx * scaleX, 0]);
                     }
                 }
             })
@@ -295,7 +296,9 @@ export function uiSidebar(context) {
 
             var isCollapsed = selection.classed('collapsed');
             var isCollapsing = !isCollapsed;
-            var xMarginProperty = textDirection === 'rtl' ? 'margin-right' : 'margin-left';
+            var isRTL = (textDirection === 'rtl');
+            var scaleX = isRTL ? 0 : 1;
+            var xMarginProperty = isRTL ? 'margin-right' : 'margin-left';
 
             sidebarWidth = selection.node().getBoundingClientRect().width;
 
@@ -318,7 +321,7 @@ export function uiSidebar(context) {
                     return function(t) {
                         var dx = lastMargin - Math.round(i(t));
                         lastMargin = lastMargin - dx;
-                        context.ui().onResize(moveMap ? undefined : [dx, 0]);
+                        context.ui().onResize(moveMap ? undefined : [dx * scaleX, 0]);
                     };
                 })
                 .on('end', function() {
@@ -351,4 +354,4 @@ export function uiSidebar(context) {
     sidebar.toggle = function() {};
 
     return sidebar;
-}
\ No newline at end of file
+}