我有一个导航栏，有两个问题，一个和另一个
下面是fiddle http://jsfiddle.net/sgtrx/中的代码（应该在早些时候完成，对不起）
好的，我的导航栏在Div包装器内，在标题下，在内容区域（主体）的顶部。
我是个新手，所以请原谅我可能犯的任何错误。
当我添加边框来分隔每个块（按钮或文本）时，它很好地分隔了按钮，然而，它在导航栏的末尾（右侧）留下了一个小空格。
包装器Div是1000px，我有5个按钮，每个200px，因此没有边框，他们适合完美，但有边框，如果我保持宽度在200px，导航条向下移动，当我减少导航条的宽度，它留下的空白在右边。我已经这样做了2天，我终于屈服了。力所能及的请帮忙。多谢了。
<body>
<div id="wrapper">
header id="top">
<div id="test">
<img src="images/vintage.jpg" width="1000" height="605" table width="780" order="0" align="center" cellpadding="0" cellspacing="0"/>
<nav id="mainnav">
<ul>
<li><a href="index.html" class="noBorder" >Home</a></li>
<li><a href="sightseeing.html">Sightseeing</a></li>
<li><a href="#">Eating Out</a></li>
<li><a href="#">What's On</a></li>
<li><a href="#">Test</a></li>
<li><a href="#">Test1</a></li>
<li><a href="#" class="noBorder1">Where to Stay</a></li>
</ul>
</nav></div>
</header>
和CSS
#mainnav ul {
margin-top: auto;
margin-bottom: auto;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
display: block;
float: left;
width: 1000px;
margin-left: auto;
list-style-type: none;
position: relative;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
margin-right: auto;
right: 0px;
left: 0px;
top: 0px;
bottom: 25px;
}
/*This will style all links nested in the <nav> element with the ID mainnav*/
#mainnav a {
width: 197px;
display: block;
float: left;
text-align: center;
background-color: #020202;
color: #FCFCFC;
text-transform: uppercase;
padding-top: 0px;
padding-bottom: 0px;
line-height: 290%;
border-radius: 0px;
font-style: oblique;
font-weight: normal;
font-size: medium;
text-indent: 0px;
text-shadow: 0px 0px;
position: relative;
left: 0px;
margin-top: auto;
border-color: #FFFFFF;
border-left-style: solid;
border-width: thin;
right: 0px;
bottom: 0px;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
opacity: 1;
}
.noBorder {
border-left-style: none !important;
}
共有2个答案
这是你的安塞：
JsFiddle
#mainnav a{
width:19.91%;
}
我高度推荐您使用宽度：20%的每个按钮，而不是使用固定值。
navbar也一样，使用width：100%
-
我正在制作一个使用HTML的网站，我想把一个导航栏在每一个页面上，所以我创建了一个单独的HTML导航，但我不知道如何把它放在每一个页面上。这是我的导航HTML代码的一小部分，我必须做什么，把它放在每一个页面。而且我并不打算使用PHP。
-
这是哲学家进餐问题的另一个实现，这是家庭作业问题，我将在这里展示我迄今为止所做的尝试： 大部分的代码是准备好的，除了和方法需要改变，我所做的就是添加这个： 和 我知道这不是线程安全的，这个链接也保证了这一点。真正的神话是老师希望我们使用lock来解决这个问题，我可以在和中锁定/解锁互斥锁，锁定和解锁两个锁（choppestick[philosopherNumber].lock（）；和筷子[（哲学家
-
我有问题使我的导航栏坚持到页面的右手边（同时仍然在1040px容器）。我希望导航栏是在同一行的标题'Ejharris tutoring'但在右边 代码如下： 样式表： HTML：
-
使用杰克逊2. x json响应如下所示： “标志”键不提供任何有用信息。我想忽略“flag”键，并将“important”值展开为important的一个实例。 当我尝试向important添加@JsonRootName（“important”）并使用反序列化功能配置ObjectMapper时。UNWRAP\u ROOT\u值我收到一个JsonMappingException： 根名称“flag
-
我正在使用Material-用户界面-Next，并试图以一种非常特殊的方式创建图像。 我有一些相当奇怪的问题。 1-3出现在1下面 2-2和3不会填满它们的整个空间（当突出显示时，无论图像如何，只有一半的内容空间被利用） 3-有时我会得到类似以下的东西： 为了便于参考，如果您遵循此链接，那么您将转到物料ui下一个GridList文档。在高级网格列表下，您将看到一个大图像和许多小图像。我的目标是将其
-
我正在尝试使用FFMPEG合并2个mp4文件。其中一个文件同时具有视频和音频（），而另一个只有音频（）。这些文件的名称以以下方式列在名为的文本文件中： 然后执行下面的ffmpeg命令来合并它们。 但是，生成的连接文件只包含。也就是说，如果