diff --git a/src/components/panel/panel.js b/src/components/panel/panel.js
index 309d34f7869..f473e70b566 100644
--- a/src/components/panel/panel.js
+++ b/src/components/panel/panel.js
@@ -1044,10 +1044,10 @@ MdPanelService.prototype._closeFirstOpenedPanel = function(groupName) {
 
 
 /**
- * Wraps the users template in two elements, md-panel-outer-wrapper, which
- * covers the entire attachTo element, and md-panel, which contains only the
- * template. This allows the panel control over positioning, animations,
- * and similar properties.
+ * Wraps the user's template in three elements:
+ * - md-panel-outer-wrapper - covers the entire `attachTo` element.
+ * - md-panel-inner-wrapper - handles the positioning.
+ * - md-panel - contains the user's content and deals with the animations.
  * @param {string} origTemplate The original template.
  * @returns {string} The wrapped template.
  * @private
@@ -1059,26 +1059,32 @@ MdPanelService.prototype._wrapTemplate = function(origTemplate) {
   // height and width for positioning.
   return '' +
       '<div class="md-panel-outer-wrapper">' +
-      '  <div class="md-panel" style="left: -9999px;">' + template + '</div>' +
+        '<div class="md-panel-inner-wrapper" style="left: -9999px;">' +
+          '<div class="md-panel">' + template + '</div>' +
+        '</div>' +
       '</div>';
 };
 
 
 /**
- * Wraps a content element in a md-panel-outer wrapper and
- * positions it off-screen. Allows for proper control over positoning
- * and animations.
+ * Wraps a content element in a `md-panel-outer-wrapper`, as well as
+ * a `md-panel-inner-wrapper`, and positions it off-screen. Allows for
+ * proper control over positoning and animations.
  * @param {!angular.JQLite} contentElement Element to be wrapped.
  * @return {!angular.JQLite} Wrapper element.
  * @private
  */
 MdPanelService.prototype._wrapContentElement = function(contentElement) {
-  var wrapper = angular.element('<div class="md-panel-outer-wrapper">');
+  var outerWrapper = angular.element(
+    '<div class="md-panel-outer-wrapper">' +
+      '<div class="md-panel-inner-wrapper" style="left: -9999px;"></div>' +
+    '</div>'
+  );
 
-  contentElement.addClass('md-panel').css('left', '-9999px');
-  wrapper.append(contentElement);
+  contentElement.addClass('md-panel');
+  outerWrapper.children().eq(0).append(contentElement);
 
-  return wrapper;
+  return outerWrapper;
 };
 
 
@@ -1145,6 +1151,9 @@ function MdPanelRef(config, $injector) {
   /** @type {!angular.JQLite|undefined} */
   this.panelEl;
 
+  /** @type {!angular.JQLite|undefined} */
+  this.innerWrapper;
+
   /**
    * Whether the panel is attached. This is synchronous. When attach is called,
    * isAttached is set to true. When detach is called, isAttached is set to
@@ -1587,6 +1596,11 @@ MdPanelRef.prototype._compile = function() {
       );
     }
 
+    // Save a reference to the inner wrapper.
+    self.innerWrapper = angular.element(
+      self.panelContainer[0].querySelector('.md-panel-inner-wrapper')
+    );
+
     // Save a reference to the cleanup function from the compiler.
     self._compilerCleanup = compileData.cleanup;
 
@@ -1662,14 +1676,14 @@ MdPanelRef.prototype._addStyles = function() {
   var self = this;
   return this._$q(function(resolve) {
     self.panelContainer.css('z-index', self.config['zIndex']);
-    self.panelEl.css('z-index', self.config['zIndex'] + 1);
+    self.innerWrapper.css('z-index', self.config['zIndex'] + 1);
 
     var hideAndResolve = function() {
       // Theme the element and container.
       self._setTheming();
 
       // Remove left: -9999px and add hidden class.
-      self.panelEl.css('left', '');
+      self.innerWrapper.css('left', '');
       self.panelContainer.addClass(MD_PANEL_HIDDEN);
 
       resolve(self);
@@ -1736,26 +1750,26 @@ MdPanelRef.prototype._updatePosition = function(init) {
   var positionConfig = this.config['position'];
 
   if (positionConfig) {
-    positionConfig._setPanelPosition(this.panelEl);
+    positionConfig._setPanelPosition(this.innerWrapper);
 
     // Hide the panel now that position is known.
     if (init) {
       this.panelContainer.addClass(MD_PANEL_HIDDEN);
     }
 
-    this.panelEl.css(
+    this.innerWrapper.css(
       MdPanelPosition.absPosition.TOP,
       positionConfig.getTop()
     );
-    this.panelEl.css(
+    this.innerWrapper.css(
       MdPanelPosition.absPosition.BOTTOM,
       positionConfig.getBottom()
     );
-    this.panelEl.css(
+    this.innerWrapper.css(
       MdPanelPosition.absPosition.LEFT,
       positionConfig.getLeft()
     );
-    this.panelEl.css(
+    this.innerWrapper.css(
       MdPanelPosition.absPosition.RIGHT,
       positionConfig.getRight()
     );
@@ -2662,24 +2676,24 @@ MdPanelPosition.prototype.getTransform = function() {
 
 
 /**
- * Sets the `transform` value for a panel element.
- * @param {!angular.JQLite} panelEl
+ * Sets the `transform` value for an element.
+ * @param {!angular.JQLite} el
  * @returns {!angular.JQLite}
  * @private
  */
-MdPanelPosition.prototype._setTransform = function(panelEl) {
-  return panelEl.css(this._$mdConstant.CSS.TRANSFORM, this.getTransform());
+MdPanelPosition.prototype._setTransform = function(el) {
+  return el.css(this._$mdConstant.CSS.TRANSFORM, this.getTransform());
 };
 
 
 /**
  * True if the panel is completely on-screen with this positioning; false
  * otherwise.
- * @param {!angular.JQLite} panelEl
+ * @param {!angular.JQLite} el
  * @return {boolean}
  * @private
  */
-MdPanelPosition.prototype._isOnscreen = function(panelEl) {
+MdPanelPosition.prototype._isOnscreen = function(el) {
   // this works because we always use fixed positioning for the panel,
   // which is relative to the viewport.
   var left = parseInt(this.getLeft());
@@ -2687,13 +2701,13 @@ MdPanelPosition.prototype._isOnscreen = function(panelEl) {
 
   if (this._translateX.length || this._translateY.length) {
     var prefixedTransform = this._$mdConstant.CSS.TRANSFORM;
-    var offsets = getComputedTranslations(panelEl, prefixedTransform);
+    var offsets = getComputedTranslations(el, prefixedTransform);
     left += offsets.x;
     top += offsets.y;
   }
 
-  var right = left + panelEl[0].offsetWidth;
-  var bottom = top + panelEl[0].offsetHeight;
+  var right = left + el[0].offsetWidth;
+  var bottom = top + el[0].offsetHeight;
 
   return (left >= 0) &&
     (top >= 0) &&
@@ -2733,53 +2747,53 @@ MdPanelPosition.prototype._reduceTranslateValues =
 /**
  * Sets the panel position based on the created panel element and best x/y
  * positioning.
- * @param {!angular.JQLite} panelEl
+ * @param {!angular.JQLite} el
  * @private
  */
-MdPanelPosition.prototype._setPanelPosition = function(panelEl) {
-  // Remove the "position adjusted" class in case it has been added before.
-  panelEl.removeClass('_md-panel-position-adjusted');
+MdPanelPosition.prototype._setPanelPosition = function(el) {
+  // Remove the class in case it has been added before.
+  el.removeClass('_md-panel-position-adjusted');
 
   // Only calculate the position if necessary.
   if (this._absolute) {
-    this._setTransform(panelEl);
+    this._setTransform(el);
     return;
   }
 
   if (this._actualPosition) {
-    this._calculatePanelPosition(panelEl, this._actualPosition);
-    this._setTransform(panelEl);
-    this._constrainToViewport(panelEl);
+    this._calculatePanelPosition(el, this._actualPosition);
+    this._setTransform(el);
+    this._constrainToViewport(el);
     return;
   }
 
   for (var i = 0; i < this._positions.length; i++) {
     this._actualPosition = this._positions[i];
-    this._calculatePanelPosition(panelEl, this._actualPosition);
-    this._setTransform(panelEl);
+    this._calculatePanelPosition(el, this._actualPosition);
+    this._setTransform(el);
 
-    if (this._isOnscreen(panelEl)) {
+    if (this._isOnscreen(el)) {
       return;
     }
   }
 
-  this._constrainToViewport(panelEl);
+  this._constrainToViewport(el);
 };
 
 
 /**
  * Constrains a panel's position to the viewport.
- * @param {!angular.JQLite} panelEl
+ * @param {!angular.JQLite} el
  * @private
  */
-MdPanelPosition.prototype._constrainToViewport = function(panelEl) {
+MdPanelPosition.prototype._constrainToViewport = function(el) {
   var margin = MdPanelPosition.viewportMargin;
   var initialTop = this._top;
   var initialLeft = this._left;
 
   if (this.getTop()) {
     var top = parseInt(this.getTop());
-    var bottom = panelEl[0].offsetHeight + top;
+    var bottom = el[0].offsetHeight + top;
     var viewportHeight = this._$window.innerHeight;
 
     if (top < margin) {
@@ -2791,7 +2805,7 @@ MdPanelPosition.prototype._constrainToViewport = function(panelEl) {
 
   if (this.getLeft()) {
     var left = parseInt(this.getLeft());
-    var right = panelEl[0].offsetWidth + left;
+    var right = el[0].offsetWidth + left;
     var viewportWidth = this._$window.innerWidth;
 
     if (left < margin) {
@@ -2802,7 +2816,7 @@ MdPanelPosition.prototype._constrainToViewport = function(panelEl) {
   }
 
   // Class that can be used to re-style the panel if it was repositioned.
-  panelEl.toggleClass(
+  el.toggleClass(
     '_md-panel-position-adjusted',
     this._top !== initialTop || this._left !== initialLeft
   );
@@ -2841,13 +2855,13 @@ MdPanelPosition.prototype._bidi = function(position) {
 /**
  * Calculates the panel position based on the created panel element and the
  * provided positioning.
- * @param {!angular.JQLite} panelEl
+ * @param {!angular.JQLite} el
  * @param {!{x:string, y:string}} position
  * @private
  */
-MdPanelPosition.prototype._calculatePanelPosition = function(panelEl, position) {
+MdPanelPosition.prototype._calculatePanelPosition = function(el, position) {
 
-  var panelBounds = panelEl[0].getBoundingClientRect();
+  var panelBounds = el[0].getBoundingClientRect();
   var panelWidth = panelBounds.width;
   var panelHeight = panelBounds.height;
 
diff --git a/src/components/panel/panel.scss b/src/components/panel/panel.scss
index f90bfd863a3..77440bdb818 100644
--- a/src/components/panel/panel.scss
+++ b/src/components/panel/panel.scss
@@ -6,17 +6,12 @@
   width: 100%;
 }
 
-._md-panel-hidden {
-  display: none;
+.md-panel-inner-wrapper {
+  position: fixed;
 }
 
-._md-panel-fullscreen {
-  border-radius: 0;
-  left: 0;
-  min-height: 100%;
-  min-width: 100%;
-  position: fixed;
-  top: 0;
+._md-panel-hidden {
+  display: none;
 }
 
 // Only used when no animations are present.
@@ -27,7 +22,7 @@
 
 .md-panel {
   opacity: 0;
-  position: fixed;
+  position: relative;
 
   &._md-panel-shown {
     // Only used when custom animations are present.
@@ -53,7 +48,7 @@
 
   &._md-panel-backdrop {
     height: 100%;
-    position: absolute;
+    position: fixed;
     width: 100%;
   }
 
@@ -66,3 +61,12 @@
     transition: opacity $material-leave-duration $material-leave-timing-function;
   }
 }
+
+._md-panel-fullscreen {
+  border-radius: 0;
+  left: 0;
+  min-height: 100%;
+  min-width: 100%;
+  position: fixed;
+  top: 0;
+}
diff --git a/src/components/panel/panel.spec.js b/src/components/panel/panel.spec.js
index a4c161ef7ea..704648f732b 100644
--- a/src/components/panel/panel.spec.js
+++ b/src/components/panel/panel.spec.js
@@ -7,6 +7,8 @@ describe('$mdPanel', function() {
   var PANEL_WRAPPER_CLASS = 'md-panel-outer-wrapper';
   var PANEL_EL = '.md-panel';
   var PANEL_EL_CLASS = 'md-panel';
+  var INNER_WRAPPER = '.md-panel-inner-wrapper';
+  var INNER_WRAPPER_CLASS = 'md-panel-inner-wrapper';
   var HIDDEN_CLASS = '_md-panel-hidden';
   var FOCUS_TRAPS_CLASS = '._md-panel-focus-trap';
   var FULLSCREEN_CLASS = '_md-panel-fullscreen';
@@ -1887,6 +1889,25 @@ describe('$mdPanel', function() {
         expect(middleOfPanel)
             .toBeApproximately(middleOfPage + parseInt(offset));
       });
+
+      it('should apply offsets to the panel inner wrapper, instead of directly ' +
+        'on the panel element', function() {
+        var position = mdPanelPosition
+            .absolute()
+            .withOffsetX('-10px');
+
+        config['position'] = position;
+
+        openPanel(config);
+
+        var transform = $mdConstant.CSS.TRANSFORM;
+        var panelEl = document.querySelector(PANEL_EL);
+        var innerWrapper = document.querySelector(INNER_WRAPPER);
+
+        expect(panelEl.style[transform]).toBeFalsy();
+        expect(innerWrapper.style[transform]).toBeTruthy();
+        expect(panelEl.parentNode).toBe(innerWrapper);
+      });
     });
 
     describe('should absolutely position the panel at', function() {
@@ -1897,7 +1918,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.top).toEqual(top);
       });
 
@@ -1907,7 +1928,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.top).toEqual('0px');
       });
 
@@ -1917,7 +1938,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.bottom).toEqual('')
         expect(panelCss.top).toEqual('0px');
       });
@@ -1929,7 +1950,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.bottom).toEqual(bottom);
       });
 
@@ -1939,7 +1960,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.bottom).toEqual('0px');
       });
 
@@ -1949,7 +1970,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.top).toEqual('');
         expect(panelCss.bottom).toEqual('0px');
       });
@@ -1961,7 +1982,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.left).toEqual(left);
       });
 
@@ -1971,7 +1992,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.left).toEqual('0px');
       });
 
@@ -1981,7 +2002,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.right).toEqual('');
         expect(panelCss.left).toEqual('0px');
       });
@@ -1993,7 +2014,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.right).toEqual(right);
       });
 
@@ -2003,7 +2024,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.right).toEqual('0px');
       });
 
@@ -2013,7 +2034,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.left).toEqual('');
         expect(panelCss.right).toEqual('0px');
       });
@@ -2024,7 +2045,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.left).toEqual(start);
       });
 
@@ -2036,7 +2057,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.right).toEqual(start);
       });
 
@@ -2046,7 +2067,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.right).toEqual(end);
       });
 
@@ -2058,7 +2079,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.left).toEqual(end);
       });
 
@@ -2070,7 +2091,7 @@ describe('$mdPanel', function() {
 
         var middleOfPage = 0.5 * window.innerWidth;
 
-        var panelRect = document.querySelector(PANEL_EL)
+        var panelRect = document.querySelector(INNER_WRAPPER)
             .getBoundingClientRect();
         var middleOfPanel = panelRect.left + 0.5 * panelRect.width;
 
@@ -2085,7 +2106,7 @@ describe('$mdPanel', function() {
 
         var middleOfPage = 0.5 * window.innerHeight;
 
-        var panelRect = document.querySelector(PANEL_EL)
+        var panelRect = document.querySelector(INNER_WRAPPER)
             .getBoundingClientRect();
         var middleOfPanel = panelRect.top + 0.5 * panelRect.height;
 
@@ -2101,7 +2122,7 @@ describe('$mdPanel', function() {
         var middleOfPageX = 0.5 * window.innerWidth;
         var middleOfPageY = 0.5 * window.innerHeight;
 
-        var panelRect = document.querySelector(PANEL_EL)
+        var panelRect = document.querySelector(INNER_WRAPPER)
             .getBoundingClientRect();
         var middleOfPanelX = panelRect.left + 0.5 * panelRect.width;
         var middleOfPanelY = panelRect.top + 0.5 * panelRect.height;
@@ -2137,7 +2158,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.left).toBeApproximately(myButtonRect.left);
         expect(panelCss.top).toBeApproximately(myButtonRect.top);
       });
@@ -2151,7 +2172,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.left).toBeApproximately(myButtonRect.left);
         expect(panelCss.top).toBeApproximately(myButtonRect.top);
       });
@@ -2165,7 +2186,7 @@ describe('$mdPanel', function() {
 
         openPanel(config);
 
-        var panelCss = document.querySelector(PANEL_EL).style;
+        var panelCss = document.querySelector(INNER_WRAPPER).style;
         expect(panelCss.left).toBeApproximately(myButtonRect.left);
         expect(panelCss.top).toBeApproximately(myButtonRect.top);
       });
@@ -2191,7 +2212,7 @@ describe('$mdPanel', function() {
             y: yPosition.ALIGN_TOPS,
           });
 
-          var panelCss = document.querySelector(PANEL_EL).style;
+          var panelCss = document.querySelector(INNER_WRAPPER).style;
           expect(panelCss.left).toBeApproximately(myButtonRect.left);
           expect(panelCss.top).toBeApproximately(myButtonRect.top);
         });
@@ -2382,8 +2403,8 @@ describe('$mdPanel', function() {
           panelRef.open();
           flushPanel();
 
-          expect(panelRef.panelEl[0].offsetLeft).toBe(VIEWPORT_MARGIN);
-          expect(panelRef.panelEl[0]).toHaveClass(ADJUSTED_CLASS);
+          expect(panelRef.innerWrapper[0].offsetLeft).toBe(VIEWPORT_MARGIN);
+          expect(panelRef.innerWrapper).toHaveClass(ADJUSTED_CLASS);
 
           panelRef.close();
           flushPanel();
@@ -2391,8 +2412,8 @@ describe('$mdPanel', function() {
           panelRef.open();
           flushPanel();
 
-          expect(panelRef.panelEl[0].offsetLeft).toBe(VIEWPORT_MARGIN);
-          expect(panelRef.panelEl[0]).toHaveClass(ADJUSTED_CLASS);
+          expect(panelRef.innerWrapper[0].offsetLeft).toBe(VIEWPORT_MARGIN);
+          expect(panelRef.innerWrapper).toHaveClass(ADJUSTED_CLASS);
 
           panelRef.destroy();
         });
@@ -2407,7 +2428,7 @@ describe('$mdPanel', function() {
 
           openPanel(config);
 
-          var panelRect = document.querySelector(PANEL_EL)
+          var panelRect = document.querySelector(INNER_WRAPPER)
               .getBoundingClientRect();
           expect(panelRect.bottom).toBeApproximately(myButtonRect.top);
         });
@@ -2421,7 +2442,7 @@ describe('$mdPanel', function() {
 
           openPanel(config);
 
-          var panelRect = document.querySelector(PANEL_EL)
+          var panelRect = document.querySelector(INNER_WRAPPER)
               .getBoundingClientRect();
           expect(panelRect.top).toBeApproximately(myButtonRect.top);
         });
@@ -2436,7 +2457,7 @@ describe('$mdPanel', function() {
           openPanel(config);
 
           var middleOfButton = myButtonRect.top + 0.5 * myButtonRect.height;
-          var panelRect = document.querySelector(PANEL_EL)
+          var panelRect = document.querySelector(INNER_WRAPPER)
               .getBoundingClientRect();
           var middleOfPanel = panelRect.top + 0.5 * panelRect.height;
 
@@ -2452,7 +2473,7 @@ describe('$mdPanel', function() {
 
           openPanel(config);
 
-          var panelRect = document.querySelector(PANEL_EL)
+          var panelRect = document.querySelector(INNER_WRAPPER)
               .getBoundingClientRect();
           expect(panelRect.bottom).toBeApproximately(myButtonRect.bottom);
         });
@@ -2466,7 +2487,7 @@ describe('$mdPanel', function() {
 
           openPanel(config);
 
-          var panelRect = document.querySelector(PANEL_EL)
+          var panelRect = document.querySelector(INNER_WRAPPER)
               .getBoundingClientRect();
           expect(panelRect.top).toBeApproximately(myButtonRect.bottom);
         });
@@ -2486,7 +2507,7 @@ describe('$mdPanel', function() {
 
           openPanel(config);
 
-          var panel = document.querySelector(PANEL_EL);
+          var panel = document.querySelector(INNER_WRAPPER);
 
           expect(panel.offsetLeft).toBe(VIEWPORT_MARGIN);
           expect(panel).toHaveClass(ADJUSTED_CLASS);
@@ -2507,7 +2528,7 @@ describe('$mdPanel', function() {
 
           openPanel(config);
 
-          var panel = document.querySelector(PANEL_EL);
+          var panel = document.querySelector(INNER_WRAPPER);
           var panelRect = panel.getBoundingClientRect();
 
           expect(panelRect.left + panelRect.width).toBeLessThan(window.innerWidth);
@@ -2525,7 +2546,7 @@ describe('$mdPanel', function() {
 
           openPanel(config);
 
-          var panelRect = document.querySelector(PANEL_EL)
+          var panelRect = document.querySelector(INNER_WRAPPER)
               .getBoundingClientRect();
           expect(panelRect.right).toBeApproximately(myButtonRect.left);
         });
@@ -2539,7 +2560,7 @@ describe('$mdPanel', function() {
 
           openPanel(config);
 
-          var panelRect = document.querySelector(PANEL_EL)
+          var panelRect = document.querySelector(INNER_WRAPPER)
               .getBoundingClientRect();
           expect(panelRect.right).toBeApproximately(myButtonRect.right);
         });
@@ -2554,7 +2575,7 @@ describe('$mdPanel', function() {
           openPanel(config);
 
           var middleOfButton = myButtonRect.left + 0.5 * myButtonRect.width;
-          var panelRect = document.querySelector(PANEL_EL)
+          var panelRect = document.querySelector(INNER_WRAPPER)
               .getBoundingClientRect();
           var middleOfPanel = panelRect.left + 0.5 * panelRect.width;
 
@@ -2570,7 +2591,7 @@ describe('$mdPanel', function() {
 
           openPanel(config);
 
-          var panelRect = document.querySelector(PANEL_EL)
+          var panelRect = document.querySelector(INNER_WRAPPER)
               .getBoundingClientRect();
           expect(panelRect.left).toBeApproximately(myButtonRect.left);
         });
@@ -2584,7 +2605,7 @@ describe('$mdPanel', function() {
 
           openPanel(config);
 
-          var panelRect = document.querySelector(PANEL_EL)
+          var panelRect = document.querySelector(INNER_WRAPPER)
               .getBoundingClientRect();
           expect(panelRect.left).toBeApproximately(myButtonRect.right);
         });
@@ -2604,7 +2625,7 @@ describe('$mdPanel', function() {
 
           openPanel(config);
 
-          var panel = document.querySelector(PANEL_EL);
+          var panel = document.querySelector(INNER_WRAPPER);
 
           expect(panel.offsetTop).toBe(VIEWPORT_MARGIN);
           expect(panel).toHaveClass(ADJUSTED_CLASS);
@@ -2625,7 +2646,7 @@ describe('$mdPanel', function() {
 
           openPanel(config);
 
-          var panel = document.querySelector(PANEL_EL);
+          var panel = document.querySelector(INNER_WRAPPER);
           var panelRect = panel.getBoundingClientRect();
 
           expect(panelRect.top + panelRect.height).toBeLessThan(window.innerHeight);
@@ -2646,7 +2667,7 @@ describe('$mdPanel', function() {
 
             openPanel(config);
 
-            var panelRect = document.querySelector(PANEL_EL)
+            var panelRect = document.querySelector(INNER_WRAPPER)
               .getBoundingClientRect();
             expect(panelRect.left).toBeApproximately(myButtonRect.right);
           });
@@ -2660,7 +2681,7 @@ describe('$mdPanel', function() {
 
             openPanel(config);
 
-            var panelRect = document.querySelector(PANEL_EL)
+            var panelRect = document.querySelector(INNER_WRAPPER)
               .getBoundingClientRect();
             expect(panelRect.left).toBeApproximately(myButtonRect.left);
           });
@@ -2674,7 +2695,7 @@ describe('$mdPanel', function() {
 
             openPanel(config);
 
-            var panelRect = document.querySelector(PANEL_EL)
+            var panelRect = document.querySelector(INNER_WRAPPER)
               .getBoundingClientRect();
             expect(panelRect.right).toBeApproximately(myButtonRect.right);
           });
@@ -2688,7 +2709,7 @@ describe('$mdPanel', function() {
 
             openPanel(config);
 
-            var panelRect = document.querySelector(PANEL_EL)
+            var panelRect = document.querySelector(INNER_WRAPPER)
               .getBoundingClientRect();
             expect(panelRect.right).toBeApproximately(myButtonRect.left);
           });
@@ -3121,9 +3142,13 @@ describe('$mdPanel', function() {
         openPanel(config);
 
         expect(panelRef.panelEl.parent())
+          .toHaveClass(INNER_WRAPPER_CLASS);
+
+        expect(panelRef.panelEl.parent().parent())
           .toHaveClass(PANEL_WRAPPER_CLASS);
 
-        expect(panelRef.panelContainer[0]).toBe(config.contentElement.parent()[0]);
+        expect(panelRef.innerWrapper[0]).toBe(config.contentElement.parent()[0]);
+        expect(panelRef.panelContainer[0]).toBe(config.contentElement.parent().parent()[0]);
       });
 
     it('should add the proper class to the panel element and assign ' +
@@ -3151,13 +3176,16 @@ describe('$mdPanel', function() {
 
     it('should clear out any panel-specific inline styles from the element',
       function() {
-        openPanel(config);
 
-        expect(config.contentElement.attr('style')).toBeTruthy();
+        config.contentElement.css('color', 'red');
+
+        var initialStyles = config.contentElement.attr('style');
+
+        openPanel(config);
 
         closePanel();
 
-        expect(config.contentElement.attr('style')).toBeFalsy();
+        expect(config.contentElement.attr('style')).toBe(initialStyles);
       });
 
     it('should clean up the panel via the cleanup function from the compiler',