html - Chrome 导航栏中的换行符,但 Firefox 中没有

标签 html css google-chrome navigation line-breaks

这是问题页面:http://www.jacobsievers.com/sample.html

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

HTML
(来源:jacobsievers.com)

CSS
(来源:jacobsievers.com)

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

最佳答案

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/

关于html - Chrome 导航栏中的换行符,但 Firefox 中没有,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14490500/

相关文章:

html - 尽管有元视口(viewport)标签,Firefox 移动版仍可缩放视口(viewport)

html - Chrome 中鼠标悬停时最后选择的选项未突出显示

javascript - 在 Chrome 中选择相同文件时 FileReader onload 不会被触发

firefox - 如何获取具有多个来源的视频的 src?

javascript - CSS/JS 模糊鼠标周围除外

javascript - Designmodo 的带有 Ruby on Rails 的启动框架工具包?

css - css 转换中的三 Angular 函数?

html - WKHTMLTOPDF - 边框出现在 pdf 上

android - 如何在不同的移动平台上以同样的方式展示内容?

javascript - 谷歌地图标记,多个单独的事件