html - 垂直导航栏

Question

我正在尝试从无序列表中创建一个导航栏。此列表需要垂直并拉到左侧。我现在拥有的内容是一个一直到左侧的垂直列表，但它位于我的内容顶部而不是左侧。

<ul id='help_links'>
    <li><a href="#annoucements">Announcements</a></li>
    <li><a href="#approvals">Approvals</a></li>
    #...
</ul>

<div id='content' style='margin:20px auto;'>
  <a name="annoucements"><h2>Announcements</h2></a>
  <h3>Creating Annoucements</h3>
  <ul style="list-style-type:circle;">
    <li>...</li>
#...
  </div>

#help_links ul
{
    margin:0;
    padding:0;
}

#help_links li{
    display:block;
}

我需要更改什么才能获得中间的内容并将 help_links 列在左侧。

Answer 1

将列表放在一个 div 中，让我们将其类称为 divlink 并将其添加到您的 css 中：

div.divlink
{
    float: left;
    height: 100%;
}
div.content
{
    float: left;
    height: 100%;
}

哦，在这样做之后，您应该在内容 div 中使用填充而不是边距。根据我的经验，浮动的边距很奇怪。