Question

链接离开导航栏，因为它太高（我认为），我希望这些项目彼此不同。

#navbar {
    height: 21px;
    width: 100%;
    top: 200px;
    text-align: center;
    font-size: 20px;
}

哦，这是HTML：

<div id="navbar">
          {block:AskEnabled}
          <div class="navitem"><a href="/ask">{AskLabel}</a></div class>
          {/block:AskEnabled}
          {block:SubmissionsEnabled}
          <div class="navitem"><a href="/submit">{SubmitLabel}</a></div class>
          {/block:SubmissionsEnabled}
           <div class="navitem"><a href="{text:Link 1 Path}">{text:Link 1}</a></div class><div class="navitem"><a href="{text:Link 2 Path}">{text:Link 2}</a></div class><div class="navitem"><a href="{text:Link 3 Path}">{text:Link 3}</a></div class>


          </div id="navbar">

忽略括号中的东西，比如AskLabel和div类navitem，我摆脱了它：P

Answer 1

由于您的链接位于div s（块元素）中，因此每个div之间都有分页符。您需要在span display: inline元素上使用类似navitem或div的内容。

参见示例：http://jsfiddle.net/7dPkQ/3/

编辑以澄清：span默认设置为display: inline。默认情况下，div设置为display: block。在您的示例中，如果链接包含在inline元素中，则链接将并排显示。另请参阅http://www.w3schools.com/cssref/pr_class_display.asp

链接不会保留在导航栏内

1 个答案: