在导航菜单中对齐表单

Question

CSS：这假设位于第一个导航的左侧，即服装

if (user.Gender == Gender.Male)
{
   return string.Format(localizer["FollowAcceptedMale"], followerName, followeeName , groupName);
}
else if (user.Gender == Gender.Female)
{
   return string.Format(localizer["FollowAcceptedFemale"], followerName, followeeName , groupName);
}

NAV MENU：这是主要的导航菜单，假设是广播男性或女性应该与导航内联，但不是这里的情况

IStringLocalizer

这是结果

Answer 1

只需使用以下CSS解决您的问题：

round(//Results/ResultSet/Row[@rowNumber="1"]/KI_VALUE)

Answer 2

只需要从按钮中移除填充，它就可以正常工作。padding: 16px;从按钮中删除。

#nav {
  width: 95%;
  font-family: Tahoma;
  font: bold;
  color: #00FFFF;
  float: none;
}
.form {
  height: 50px;
  position: absolute;
  text-align: center;
  font-size: 16px;
  font-family: Candara;
  color: #00FFFF;
  background-color: transparent;
  min-width: 160px;
  float: leftwards;
}
.dropbtn {
  background-color: transparent;
  color: #00FFFF;
  font-size: 16px;
  border: none;
  cursor: pointer;
}
.dropdown {
  position: relative;
  display: inline-block;
}
.dropdown-content {
  display: none;
  position: absolute;
  background-color: transparent;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  z-index: 1000;
}
.dropdown-content a {
  color: #00FFFF;
  padding: 6px 16px;
  text-decoration: none;
  display: block;
  z-index: 1000;
}
.dropdown-content a:hover {
  background-color: transparent
}
.dropdown:hover .dropdown-content {
  display: block;
  z-index: 1000;
}
.dropdown:hover .dropbtn {
  background-color: transparent;
}

<nav>
  <div id="nav" align="center">
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
    <form class="form">
      <input type="radio" id="male" name="gender" value="male">Male
      <input type="radio" id="female" name="gender" value="female">Female
    </form>
    <div class="dropdown">
      <div class="dropdown">
        <button class="dropbtn">Accesory</button>
        <div class="dropdown-content">
          <a href="#ring">Ring</a>
          <a href="#necklace">Necklace</a>
          <a href="#pendant">Pendant</a>
          <a href="#bracelet">Bracelet</a>
          <a href="#eye glasses">Eye Glasses</a>
          <a href="#sun glasses">Sun Glasses</a>
        </div>

      </div>
      <div class="dropdown" width="10">
        <button class="dropbtn">Shoe</button>
        <div class="dropdown-content">
          <a href="#rubber shoes">Rubber Shoes</a>
          </br>
          <a href="#running shoe">Running Shoe</a>
          </br>
          <a href="#formal shoe">Formal Shoe</a>
          </br>
          <a href="#flat shoes">Flat Shoes</a>
          </br>
          <a href="#high heels">High Heels</a>
          </br>
          <a href="#sandals">Sandals</a>
          </br>
        </div>
      </div>
    </div>
  </div>
</nav>