我的导航栏中的换行符在Chrome中,但不在Firefox中

时间:2013-01-23 22:23:00

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

以下是问题中的页面:http://www.jacobsievers.com/sample.html

在Firefox和IE浏览器中,我的导航栏显示正确,但如果您使用Chrome浏览器,则会在“图库”后面显示换行符。我想知道是否有人可以帮我弄清楚我需要做什么或改变我的代码。在我的CSS中使用nav ul或nav li的东西?

HTML http://jacobsievers.com/html.jpg

CSS http://jacobsievers.com/css.jpg

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

1 个答案:

答案 0 :(得分: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/

相关问题