html - 表格 TD 宽度不起作用

Question

我正在制作下拉菜单，显然我无法更改我尝试了不同方法的宽度。我希望每列的宽度为 200px，但它不起作用。

.dropbtn {
  background-image: url("../sliki/meni.png");
  width: 220px;
  height: 60px;
  border: none;
  cursor: pointer;
  display: inline;
}
.dropdown {
  position: relative;
  display: inline-block;
}
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
}
.dropdown-content a {
  color: black;
  padding: 10px;
  text-decoration: none;
  display: block;
}
.dropdown-content a:hover {
  background-color: #f1f1f1
}
.dropdown:hover .dropdown-content {
  display: block;
}
.dropdown:hover .dropbtn {} #uslugibn {
  background-image: url("../sliki/banner.png");
  width: 100%;
  height: 300px;
}
#meninav {
  background-color: #41c2ac;
  height: 60px;
  margin: 0;
}
#meninav li {
  display: inline-block;
}

<div class="dropdown" style="float:left;">
  <button class="dropbtn"></button>
  <div class="dropdown-content" style="left:0;">
    <table>
      <tr>
        <td style="width:200px;">
          <a href="#">Берово</a>
          <a href="#">Битола</a>
          <a href="#">Богданци</a>
          <a href="#">Валандово</a>
          <a href="#">Велес</a>
          <a href="#">Виница</a>
        </td>
        <td style="width:200px;">
          <a href="#">Гевгелија</a>
          <a href="#">Гостивар</a>
          <a href="#">Дебар</a>
          <a href="#">Делчево</a>
          <a href="#">Демир Капија</a>
          <a href="#">Демир Хисар</a>
        </td>
        <td style="width:200px;">
          <a href="#">Кавадарци</a>
          <a href="#">Кичево</a>
          <a href="#">Кочани</a>
          <a href="#">Кратово</a>
          <a href="#">Крива Паланка</a>
          <a href="#">Куманово</a>
        </td>
        <td style="width:200px;">
          <a href="#">Крушево</a>
          <a href="#">Македоснки Брод</a>
          <a href="#">Македонска Каменица</a>
          <a href="#">Неготино</a>
          <a href="#">Охрид</a>
          <a href="#">Пехчево</a>
        </td>
        <td style="width:200px;">
          <a href="#">Прилеп</a>
          <a href="#">Пробиштип</a>
          <a href="#">Радовиш</a>
          <a href="#">Ресен</a>
          <a href="#">Свети Николе</a>
          <a href="#"><strong>Скопје</strong></a>
        </td>
        <td style="width:200px;">
          <a href="#">Струга</a>
          <a href="#">Струмица</a>
          <a href="#">Тетово</a>
          <a href="#">Штип</a>
        </td>
      </tr>
    </table>
  </div>
</div>

Answer 1

当您的表格不考虑宽度时，最好逐个单元格地应用它。但是这个快速修复似乎总是对我有用:

table{
   table-layout: fixed;
   width: 100%;
}

Working fiddle as well