导航按钮间距彼此不同,而不是并排

时间:2015-06-24 18:47:25

标签: html css

我的Navbar按钮间距出现问题。我不知道为什么字母在彼此之下而不是并排,我尝试使用内联块;但这似乎不起作用,所以我确信代码中有一些事情正在发生。 sub_menu使用内联块

工作正常

Jsfiddle

CSS

<ul id="right_menu"><li><a href="#">Home</a></li>
        <li><a href="#">About Me</a></li>
        <li><a href="#">Testing Two</a></li>
        <li><a href="#">Testing Three</a>
          <ul class="sub_menu"><li><a href="#">Sub Test</a>
          <ul class="sub_menu2"><li><a href="#">Sub Test Two</a>
        </li>
</ul></li>
          </ul></li>
        <li><a href="#">Message Me</a></li>
</ul>

html

SELECT DISTINCT X FROM T1 JOIN T1 AS T2 ON T1.X = T2.Y WHERE T2.Z = 'Some Name' UNION
SELECT DISTINCT X FROM T1 JOIN T1 AS T2 ON ISDESCENDANT(T1,T2.Y) WHERE T2.Z = 'Some Name' UNION
SELECT DISTINCT X FROM T1 JOIN T1 AS T2 ON ISDESCENDANT(T1,T2.Y) WHERE T2.Z = 'Some Name'

2 个答案:

答案 0 :(得分:2)

想出了问题,就在这里,我只是在我的right_menu文本中添加了宽度

#right_menu li a {
  text-align:center;
  width:100px;
  display:block;
  padding:0px;
  position:fixed;
  text-transform:uppercase;
  text-decoration:none;
}

答案 1 :(得分:2)

您也可以尝试white-space: nowrap;

#right_menu li a {
 text-align: center;
 display: block;
 padding: 20px;
 position: fixed;
 text-transform: uppercase;
 text-decoration: none;
 white-space: nowrap;
}

https://jsfiddle.net/afelixj/sb92hx0k/1/