diff --git a/src/components/panel/panel.js b/src/components/panel/panel.js
index 4b11929b293..71bd87962e4 100644
--- a/src/components/panel/panel.js
+++ b/src/components/panel/panel.js
@@ -1306,10 +1306,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
@@ -1321,26 +1321,32 @@ MdPanelService.prototype._wrapTemplate = function(origTemplate) {
   // height and width for positioning.
   return '' +
       '<div class="md-panel-outer-wrapper">' +
-      '  <div class="md-panel _md-panel-offscreen">' + template + '</div>' +
+        '<div class="md-panel-inner-wrapper" style="left: -9999px;">' +
+          '<div class="md-panel _md-panel-offscreen">' + 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 _md-panel-offscreen');
-  wrapper.append(contentElement);
+  outerWrapper.children().eq(0).append(contentElement);
 
-  return wrapper;
+  return outerWrapper;
 };
 
 
@@ -1407,6 +1413,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
@@ -1853,6 +1862,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;
 
@@ -1929,7 +1943,7 @@ 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.
@@ -1937,6 +1951,9 @@ MdPanelRef.prototype._addStyles = function() {
 
       // Remove offscreen class and add hidden class.
       self.panelEl.removeClass('_md-panel-offscreen');
+
+      // Remove left: -9999px and add hidden class.
+      self.innerWrapper.css('left', '');
       self.panelContainer.addClass(MD_PANEL_HIDDEN);
 
       resolve(self);
@@ -2003,7 +2020,7 @@ 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) {
@@ -2011,19 +2028,19 @@ MdPanelRef.prototype._updatePosition = function(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()
     );
@@ -2880,24 +2897,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());
@@ -2905,13 +2922,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) &&
@@ -2950,53 +2967,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) {
@@ -3008,7 +3025,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) {
@@ -3019,7 +3036,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
   );
@@ -3058,15 +3075,15 @@ 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 panelWidth = Math.max(panelBounds.width, panelEl[0].clientWidth);
-  var panelHeight = Math.max(panelBounds.height, panelEl[0].clientHeight);
+  var panelBounds = el[0].getBoundingClientRect();
+  var panelWidth = Math.max(panelBounds.width, el[0].clientWidth);
+  var panelHeight = Math.max(panelBounds.height, el[0].clientHeight);
 
   var targetBounds = this._relativeToEl[0].getBoundingClientRect();
 
diff --git a/src/components/panel/panel.scss b/src/components/panel/panel.scss
index 1dce9f9f4b0..e9be4d91952 100644
--- a/src/components/panel/panel.scss
+++ b/src/components/panel/panel.scss
@@ -6,21 +6,16 @@
   width: 100%;
 }
 
-._md-panel-hidden {
-  display: none;
+.md-panel-inner-wrapper {
+  position: fixed;
 }
 
 ._md-panel-offscreen {
   left: -9999px;
 }
 
-._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.
@@ -31,7 +26,7 @@
 
 .md-panel {
   opacity: 0;
-  position: fixed;
+  position: relative;
 
   &._md-panel-shown {
     // Only used when custom animations are present.
@@ -57,7 +52,7 @@
 
   &._md-panel-backdrop {
     height: 100%;
-    position: absolute;
+    position: fixed;
     width: 100%;
   }
 
@@ -70,3 +65,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 edb7ac2d0ac..0ad6bd23586 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';
@@ -2073,6 +2075,25 @@ describe('$mdPanel', function() {
 
         expect(panelRect.left).toBeApproximately(parseInt(left) + 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() {
@@ -2083,7 +2104,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);
       });
 
@@ -2093,7 +2114,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');
       });
 
@@ -2103,7 +2124,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');
       });
@@ -2115,7 +2136,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);
       });
 
@@ -2125,7 +2146,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');
       });
 
@@ -2135,7 +2156,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');
       });
@@ -2147,7 +2168,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);
       });
 
@@ -2157,7 +2178,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');
       });
 
@@ -2167,7 +2188,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');
       });
@@ -2179,7 +2200,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);
       });
 
@@ -2189,7 +2210,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');
       });
 
@@ -2199,7 +2220,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');
       });
@@ -2210,7 +2231,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);
       });
 
@@ -2222,7 +2243,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);
       });
 
@@ -2232,7 +2253,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);
       });
 
@@ -2244,7 +2265,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);
       });
 
@@ -2256,7 +2277,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;
 
@@ -2271,7 +2292,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;
 
@@ -2287,7 +2308,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;
@@ -2323,7 +2344,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);
       });
@@ -2337,7 +2358,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);
       });
@@ -2351,7 +2372,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);
       });
@@ -2377,7 +2398,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);
         });
@@ -2568,8 +2589,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();
@@ -2577,8 +2598,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();
         });
@@ -2593,7 +2614,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);
         });
@@ -2607,7 +2628,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);
         });
@@ -2622,7 +2643,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;
 
@@ -2638,7 +2659,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);
         });
@@ -2652,7 +2673,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);
         });
@@ -2672,7 +2693,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);
@@ -2693,7 +2714,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);
@@ -2711,7 +2732,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);
         });
@@ -2725,7 +2746,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);
         });
@@ -2740,7 +2761,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;
 
@@ -2756,7 +2777,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);
         });
@@ -2770,7 +2791,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);
         });
@@ -2790,7 +2811,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);
@@ -2811,7 +2832,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);
@@ -2832,7 +2853,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);
           });
@@ -2846,7 +2867,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);
           });
@@ -2860,7 +2881,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);
           });
@@ -2874,7 +2895,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);
           });
@@ -3350,9 +3371,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 ' +
@@ -3380,13 +3405,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',