我的导航栏中的换行符在 Chrome 但不是 Firefox答案

【问题标题】：Line break in my Navigation bar in Chrome but not Firefox我的导航栏中的换行符在 Chrome 但不是 Firefox
【发布时间】：2013-01-23 22:23:00
【问题描述】：

这里是有问题的页面：http://www.jacobsievers.com/sample.html

在 Firefox 和 IE 中，我的导航栏显示正确，但如果您使用 Chrome 查看它，“图库”后会出现换行符。我想知道是否有人可以帮助我弄清楚我需要做什么或更改我的代码。我的 css 中有 nav ul 或 nav li 的东西吗？

_{（来源：jacobsievers.com）}

我不知道如何制作其他人放入代码的滚动框，所以这里有一些 jpg 抱歉！感谢您的帮助。

【问题讨论】：

从 ST2 复制代码。将其粘贴到问题中并突出显示。单击文本编辑器中的那个小“{}”按钮或按 Ctrl-K 将其标记为代码。

标签： html css google-chrome navigation line-breaks

【解决方案1】：

nav ul {
text-align: center;
width: 700px;
margin: auto;
word-spacing: 50px;
padding: 0;
font-size: 20px;
}

应该修复它:)

编辑：

    /************************ =Nav ************************/
 nav ul {
    text-align: center;
    width: 700px;
    margin: auto;
    padding: 0;
    font-size: 20px;
}
nav li {
    display: inline;
    margin: auto;
    position: relative;
    top:30px;
    margin-left: 100px;
}

nav li:first-child { margin-left: 0px; }

nav a {
    text-decoration: none;
    color: rgb(50, 140, 204);
    transition: background-color 2s;
    -moz-transition: background-color 2s;
    /* Firefox 4 */
    -webkit-transition: background-color 2s;
    /* Safari and Chrome */
    -o-transition: background-color 2s;
    /* Opera */
    transition: color 2s;
    -moz-transition: color 2s;
    /* Firefox 4 */
    -webkit-transition: color 2s;
    /* Safari and Chrome */
    -o-transition: color 2s;
    /* Opera */
}
nav a:hover {
    background-color: #E0EEEE;
    color: black;
}

jsFiddle - http://jsfiddle.net/andyjh07/cqZTV/

【讨论】：

谢谢安迪，你是对的，它确实修复了它，但我对单词间距并不完全满意。我怎样才能让 chrome 像 Firefox 一样使用 100px。
我认为使用边距可能会更好。给我几分钟，我会设置一个 jsFiddle
给你，应该做你需要的事情来配合 :)
没问题的哥们，请选择我的答案作为正确的答案（打勾的东西）
我感谢任何人的支持 :) OP 请接受这个答案，因为它已经一年多了！哈哈