角度材質：Md-sidenav-right帶md-tabs在IE中不能正常工作

Question

說明：這個問題只能在IE 11下才能看到。 IE Edge（包括仿真）不會顯示問題。

當我將md-tabs與md-sidenav結合使用時，我遇到了一個瘋狂的問題。這裏是plunkr：

http://embed.plnkr.co/if7VqrZoFKBJt4lAAoy0/

<md-sidenav class="md-sidenav-right md-whiteframe-z2" md-component-id="right"> 

     <md-toolbar class="md-theme-light"> 
     <h1 class="md-toolbar-tools">Sidenav Right</h1> 
     </md-toolbar> 
     <md-content layout-padding=""> 
     <md-tabs> 
      <md-tab label="Tab #1"></md-tab> 
      <md-tab label="Tab #2"></md-tab> 
      <md-tab label="Tab #3"></md-tab> 
     </md-tabs> 
     </md-content> 

    </md-sidenav> 

我已經重複2個sidenavs：一個使用類md-sidenav-left和其他用途md-sidenav-right。正確的不允許標籤或任何內容進行交互。

該示例和我的實際代碼都使用0.11.4，但我也測試過1.0，它也有相同的問題。

有沒有人遇到過這個問題？ Materials網站上的示例運行良好，但不使用製表符。我在想這是一個translate3d css問題，但無法證實它。

Answer 1

原來他們的css試圖搭載md-sidenav-left而不是創建一個新的風格。

這裏是固定Plunker：

http://embed.plnkr.co/7L6GuUH036F2W9i7JPwl/

這裏是從構建原SCSS：

.md-sidenav-right { 
    left: 100%; 
    top: 0; 
    transform: translate3d(-100%, 0, 0); 
    &.md-closed { 
    transform: translate3d(0%, 0, 0); 
    } 
} 

translate3d和left: 100%原來是這個問題。它存在的原因是創建正確的動畫。

以下是更正SCSS：

.md-sidenav-right { 
    left: inherit; 
    right: 0; 
    transform: translate3d(0,0,0); 
    &.md-closed { 
    transform: translate3d(100%,0,0); 
    } 
}