fix(sidenav): remove margin from content instead of setting zero

In SSR scenarious, the sidenav always gets `0` for DOM measurements,
causing it to always set a zero margin to the sidenav content. This
prevents an app from setting a custom margin so that the sidenav appears
correctly after SSR.

Author: jelbourn

src/lib/sidenav/drawer.spec.ts

@@ -651,6 +651,32 @@ describe('MatDrawerContainer', () => {
       discardPeriodicTasks();
     }));
 
+  it('should not set a style property if it would be zero', fakeAsync(() => {
+      const fixture = TestBed.createComponent(AutosizeDrawer);
+      fixture.detectChanges();
+
+      const content = fixture.debugElement.nativeElement.querySelector('.mat-drawer-content');
+      expect(content.style.marginLeft).toBe('', 'Margin should be omitted when drawer is closed');
+
+      // Open the drawer and resolve the open animation.
+      fixture.componentInstance.drawer.open();
+      fixture.detectChanges();
+      tick();
+      fixture.detectChanges();
+
+      expect(content.style.marginLeft).not.toBe('', 'Margin should be present when drawer is open');
+
+      // Close the drawer and resolve the close animation.
+      fixture.componentInstance.drawer.close();
+      fixture.detectChanges();
+      tick();
+      fixture.detectChanges();
+
+      expect(content.style.marginLeft).toBe('', 'Margin should be removed after drawer close.');
+
+      discardPeriodicTasks();
+    }));
+
     it('should be able to toggle whether the container has a backdrop', fakeAsync(() => {
       const fixture = TestBed.createComponent(BasicTestApp);
       fixture.detectChanges();

src/lib/sidenav/drawer.ts

@@ -703,7 +703,13 @@ export class MatDrawerContainer implements AfterContentInit, DoCheck, OnDestroy
     }
 
     if (left !== this._contentMargins.left || right !== this._contentMargins.right) {
-      this._contentMargins = {left, right};
+      this._contentMargins = {
+        // If either `right` or `left` is zero, don't set a style to the element. This
+        // allows users to specify a custom size via CSS class in SSR scenarios where the
+        // measured widths will always be zero.
+        left: left || null,
+        right: right || null,
+      };
 
       // Pull back into the NgZone since in some cases we could be outside. We need to be careful
       // to do it only when something changed, otherwise we can end up hitting the zone too often.