为什么这个子导航元素不能填满整个区域？

Question

我已经尝试了所有我能做到的“Rentals”元素来填充下拉菜单的整个宽度，但似乎没有任何效果。有任何想法吗？我已经尝试使用nowrap等修改宽度......似乎没有任何工作（ps。这是自定义响应式设计的一部分，所以如果某些东西看起来不合适，可能是因为我正在重置之前定义的东西）

nav ul {
  display: inline;
  width: auto;
  position: relative;
  top: 70px;
  list-style-type: none;
  padding: 0px;
  margin: 0px;
  font-family: Raleway, Arial, sans-serif;
  z-index: 10;
}
nav ul li {
  display: inline-block;
  position: relative;
  width: auto;
  list-style-type: none;
  background-color: transparent;
  padding: 0px;
}
nav ul li a {
  display: inline;
  color: #FFF;
  font-size: 14px;
  padding: 5px 5px;
  text-decoration: none;
  border-bottom: none;
}
nav ul a:hover,
nav ul a:active {
  background-color: #9a1414;
}
nav ul ul {
  display: none;
  position: absolute;
  top: 26px;
  left: 0px;
  z-index: 10;
}
nav ul li:hover > ul {
  display: block;
  background: #333;
  border-top: 1px solid #666;
}
nav ul ul li {
  float: left;
  display: block;
  margin-top: 5px;
  margin-bottom: 5px;
}

<nav>
  <ul id="nav">
    <li>
      <a href="search.php">Search</a>
      <ul>
        <li><a href="search.php">Search MLS</a>
        </li>
        <li><a href="search-commercial.php">Commercial</a>
        </li>
        <li><a href="search-rentals.php">Rentals</a>
        </li>
      </ul>
    </li>
    <li><a href="agents.php">Agents</a>
    </li>
    <li><a href="property-management.php">Property Management</a>
    </li>
    <li><a href="open-houses.php">Open Houses</a>
    </li>
    <li><a href="local.php">Local</a>
    </li>
    <li><a href="/blog/">Blog</a>
    </li>
    <li><a href="contact.php">Contact</a>
    </li>
  </ul>
</nav>