Question

我希望此导航栏可以拉伸整个长度，因此没有空格。

您可以在此处查看导航栏的代码：navigation bar builder

现在已经尝试了一段时间并且没有关于这些事情的明确答案..我真的觉得很奇怪，因为这是任何人想要在他们的网站上最常见的东西没有空格的导航栏..

Answer 1

顺便提一下，你想让它填满顶部的整个导航，所以你想要的，这会改变左边每个列表项之间的间距，你也可以添加{{1更改每个项目右侧之间的间距

padding-right

Answer 2

菜单容器确实填满了所有空间。它只是看起来没有，因为该网站上的预览容器周围有空间。

我把它放在jsbin中，看起来很好。还有一些px的保证金，这是由于机构的保证金。将其删除：

body {
  margin: 0;
}

Demo

Answer 3

你需要的CSS是

width: auto

正在使用中。在你的实际网页上，它会传播，但在这个平台上它并没有显示它最有可能因为这是开发人员的意图。具体来说，他们的css类“预览容器”限制了宽度。

Answer 4

看起来<div class="preview-container">拉伸到包含div的100％宽度（css中带有#menu-builder .right选择器的div），但该div的填充为15px 20px。

如果您将其更改为15px 0px并将<div class="preview-menu">的填充减少为0，则会延伸到主窗口的100％。

Answer 5

在宽度自动中，您只需要更改宽度自动;到宽度数;其中number是您希望它的像素数量恩。宽度440px;

Answer 6

<div id='cssmenu'>
    <ul>
        <li class='active'><a href='index.html'><span>Home</span></a>
        </li>
        <li><a href='#'><span>Products</span></a>
        </li>
        <li><a href='#'><span>About</span></a>
        </li>
        <li class='last'><a href='#'><span>Contact</span></a>
        </li>
    </ul>
</div>

Fiddle

在CSS中 - 你如何使这个导航栏延伸到它的整个长度

6 个答案: