css的“宽度”属性不适用于“百分比”，但适用于像素

Question

我想用百分比来调整下拉菜单宽度的大小，但是它不起作用，只能用像素来调整大小

#mega-menu {
  font-size: 13px;
  margin-top: 12px;
  width: 80%;
  background:rgba(0,0,0,0.5);
}

<!--navigation-->
<nav class="navbar navbar-expand-md navbar-light bg-warning">
  <a class="navbar-brand" href="#" style="color: #0c5460;font-size:             13px;">
    <img src="img/newlogo.png" height="20" width="50" />
    <i style="color: darkblue; font-family: 'B Titr';">کرمانشاه گشت
</i>
  </a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#menu1">
         <span class="navbar-toggler-icon"></span>
     </button>
  <div id="menu1" class="collapse navbar-collapse">
    <ul class="navbar-nav mr-3" style="font-size: 13px;">
      <li class="nav-item dropdown">
        <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">تورهای مسافرتی</a>

        <div class="dropdown-menu" id="mega-menu">
          <a href="#" class="dropdown-item ">تور های داخلی</a>
          <a href="#" class="dropdown-item ">تور های خارجی</a>
          <a href="#" class="dropdown-item ">تور های لحظه آخری</a>
        </div>

      </li>

    </ul>

  </div>
</nav>