如何去除页面边距

4
页面边距和导航栏之间存在空白,那么如何删除这个空白呢? CSS 代码:
#topnav ul
{

    list-style-type:none;
    margin:0;
    padding:0;

    overflow:hidden;
}

#topnav li
{   

    float:left;
    display:inline;



}



#topnav a:link,
#topnav a:visited
{
    display:inline-block;
    width:110px;
    font-weight:bold;
    font-family:calibri;

    color:#FFFFFF;
    background-color:#98bf21;
    text-align:center;
    padding:3px;
    text-decoration:none;
    text-transform:uppercase;
}

#topnav a:hover,
#topnav a:active
{
    background-color:#7A991A;
}

HTML代码

<ul id="topnav">
    <li id="topnav"><a  href="#home">Home</a></li>
    <li id="topnav"><a  href="#news">OPD</a></li>
    <li id="topnav"><a  href="#news">IPD</a></li>
    <li id="topnav"><a  href="#news">Infrastucture</a></li>
    <li id="topnav"><a  href="#news">Gallery</a></li>
    <li id="topnav"><a  href="#news">Media</a></li>
    <li id="topnav"><a  href="#contact">Site Map</a></li>
    <li id="topnav"><a  href="#about">About</a></li>
    <li id="topnav"><a  href="#about">Nursing</a></li>
</ul>

如果您提供一个显示问题的JS Bin演示,我就能够为您修复它。 - thirtydot
2个回答

12

你需要明确将"body"元素的margin和padding设置为0。

在你的css中试试这个:

body { margin: 0; padding: 0; }

1
尝试使用Firebug、Dragonfly或类似工具查看哪个元素具有填充或边距。对于Internet Explorer(某些版本,我想),HTML元素也可能具有边距/填充。 - Stein G. Strindhaug
1
左侧的边距是否在ul的左侧?如果是这种情况,可能是由于li的自动缩进引起的。尝试调整CSS属性“list-style-position”。但是,实际上,在JSfiddler上进行演示将让我很快解决它。 - Mohag519

0
尝试添加


#topnav { font-size: 0; }
#topnav li { font-size: 12px; } /* or your font size that needed there */

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接