0

我正在开发我的第一个网站,我在每个页面的顶部都有导航链接。我注意到该网站的一些非常特殊的行为是:高度大于或等于最大垂直像素的页面占据一定宽度,而内容未填充高度的页面具有不同的宽度,即使代码为菜单完全一样。为什么会发生这种情况,补救措施是什么?这是代码:html文件:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>About</title>
    <link rel="stylesheet" type="text/css" href="about_style.css" />
</head>
<body>
    <nav id="menu">
            <ul>
                <li id="home"><a href="../index.html">Home</a></li>
                <li id="news"><a href ="../news/index_news.html">News</a></li>
                <li id="tragic_complexity"><a href="../tragic/index_tr.html">Tragic Complexity</a></li>
                <li id="d_diary"><a href="../diary/d_diary.html">D Diary</a></li>
                <li id="geeks"><a href="../geeks/geeks.html">Geeks = 1</a></li>
                <li id="about">About</li>
            </ul>
        </nav>
    <ul id="info">
        <li>
            About the site
        </li>
        <li>
            About the founder
        </li>
    </ul>
</body>
</html>

css 文件:

body
{
    background-image:linear-gradient(#336666, #66cccc);

}
#info,#menu
{
    text-align:center;
}
#info li
{
        display:block;
        font-family:serif;
        height:300px;
        width:600px;
        border:1px solid black;
        overflow:hidden;
        padding: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;
        margin:20px auto 20px auto;
        background-color:white;
}
#menu ul li
{
    display: inline-block;
    margin:auto 20px auto 20px;
    font-size: 150%;
    font-family: Arial, Verdana, sans-serif;

}
4

1 回答 1

0

这很可能只是因为在那些较长的页面上而不是在其他页面上引入了垂直滚动条。如果要删除此行为,可以强制添加滚动条,而不管内容高度如何。

检查这些链接如何:

http://egilhansen.com/2007/03/28/css-trick-always-show-scrollbars

http://css-tricks.com/snippets/css/force-vertical-scrollbar/

从第一个链接:

html {
     overflow: -moz-scrollbars-vertical;
     overflow: scroll;
}
于 2013-07-22T07:47:20.067 回答