更改兩個菜單的離子側菜單寬度

我有左和右離子側菜單，我想改變菜單寬度。我已成功更改左側菜單寬度，如下所示，但我不確定如何更改右側菜單寬度。目前，左側菜單寬度會改變，但右側菜單正在切換時，右側菜單內容會失真。更改兩個菜單的離子側菜單寬度

.menu.menu-left{ 
    width: calc(100% - 70px) !important; 
} 
.menu-open .menu-content{ 
    transform: translate3d(calc(100% - 70px), 0px, 0px) !important; 
}

Codepen Link

來源

2016-10-12 stackdisplay

根據this只是ion-side-menu元素添加width屬性。

離子文檔的sidemenu是

<ion-side-menu 
     side="left" 
     width="500"> 
</ion-side-menu>

來源

2016-10-12 11:40:22

它不工作。更改'width'屬性只會改變側邊菜單的滑動位置，但側邊菜單內容的寬度仍然保持不變。寬度屬性是側邊菜單的一部分，以便它知道在滑動時翻譯多遠。即使您確實使用css進行了更改，側邊菜單指令仍將使用默認值275。 – stackdisplay

只需添加「菜單寬度」在variables.scss

$menu-width: 200px;

來源

2017-12-01 12:26:46

更改兩個菜單的離子側菜單寬度

回答

相關問題