css - Ionic applicaiton set css translate3d not run in my device

Question

我在我的 ionic 应用程序中创建了一个菜单侧并为其设置了 CSS。这是我的代码菜单.html

<ion-side-menus enable-menu-with-back-views="false" >
  <ion-side-menu-content>
    <ion-nav-bar class="bar-stable">
      <ion-nav-back-button>
      </ion-nav-back-button>

      <ion-nav-buttons side="left">
        <button class="button button-icon button-clear ion-navicon" menu-toggle="left">

        </button>
      </ion-nav-buttons>
    </ion-nav-bar>
    <ion-nav-view name="menuContent" ></ion-nav-view>
  </ion-side-menu-content>

  <ion-side-menu side="left">
    <ion-header-bar class="bar-stable">
    	<div class="bar-header">
    	</div>
    </ion-header-bar>
    
	<ion-content class="custom">
      <ion-list>
        <ion-item menu-close>
        Tab 1
        </ion-item>
      </ion-list>
  </ion-content>
  </ion-side-menu>
</ion-side-menus>

我在 style.css 中添加了:

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

当我在我的设备上运行应用程序时，我看到了 css

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

未运行。我尝试在标签正文中添加类 platform-android 并添加 .platfrom-android.menu-open... 但它没有运行。如何修复它或如何将菜单边的宽度设置为屏幕宽度的 75%？非常感谢!

Answer 1

如果您只是想设置宽度，则不需要 calc。

width: 75%;