Question

我已经建立了几个网站，现在我有新手问题让我疯了......

这是我的代码：

<body>
<div id="page">
<div id="page_wrapper">

    <div id="header">
        <h1>Heading 1</h1>
    <div class="clear_both" />&nbsp;</div>
    </div><!-- end #header --> 

    <div id="main_menu">
        <p>Here goes the main menu</p>
    <div class="clear_both" />&nbsp;</div>
    </div><!-- end #main_menu --> 

    <div id="left">
    </div><!-- end #left -->

这是我的CSS

首先我从这里有一个CSS重置模板： http://yui.yahooapis.com/3.3.0/build/cssreset/reset-min.css

然后在另一个文件上：

body, html {
    font: 10pt Verdana,Arial,sans-serif;
    background: #fff;
    margin: 0;
    padding: 0;
    text-align: left;
    color: #333;
}
div {
    line-height: 1.4em;
}
#page {

}
#page_wrapper {

}
#main_menu {

}
#left {

}
div.clear_both {
    margin: 0;
    padding: 0;
    font-size: 0;
    height: 0;
    line-height: 0;
    clear: both;
}

在下面的链接上有一个图片截图，您可以在其上看到输出...（我在本地服务器上工作）

div标签之间有一个无法解释的空间我无法移除它并且它让我疯了......请有人能告诉我如何删除它吗？我尝试添加一个负的上边距，但从我以前的经验来看，这不是一个解决方案...通常设置边距并将填充设置为0就足够了......不知何故现在它不同了：S

enter image description here

Unexplainable DIV space

Answer 1

感谢大家，我最终找到了这个问题，但特别要感谢Notepad ++

问题是由不可见的空格（来自SPACE键）引起的。 我不知道为什么，但根据我的知识，这是第一次浏览器检测到多个空格笔画。我想现在较新的浏览器会注册多个空白区域。

我刚用Notepad ++打开html脚本，并在View-＆gt; Show Simbol-＆gt; Show All Characters中设置。然后我删除了所有不必要的空格，这解决了我的问题。

Answer 2

div {line-height: 1;}
h1, p {margin: 0;}

请勿使用单位作为行高，请参阅：Unitless line-heights了解更多信息，

如果你只是放1.4那么行高将是1.4 x the font-size，这应该可以帮助你控制你的差距，显然我上面的代码示例绝对是零，只是一个例子

JSFiddle：HERE

Answer 3

在CSS文件的顶部，只需粘贴此

即可

* { margin: 0; padding: 0; }

希望这会有所帮助。

Answer 4

<div class="clear_both" />&nbsp;</div>

这会在标题1和此处进入主菜单之间创建一个空格......

如果你有“显示：阻止”，那么DIV会低于另一个，所以即使这个div没有文本，它也有空格“”......

如果你删除了这个，那么其他所有内容就像下面的文字......

对不起，如果我理解错误......;）

Answer 5

div {line-height: 1.4em;}应该是罪魁祸首。

Answer 6

在您的DIV或图像使用上

：

.div
{
display: inline-block;
padding:0;
margin:0;
}

和身体使用：

body
{
padding:0;
margin:0;
}

我遇到了同样的问题，这对我来说很好，我刚刚修好了！希望这有助于任何人寻找答案。

Answer 7

Div在使用时会带有空格。为了删除它们

使用

margin-top: -10px

或任何方便您的页面设置。

如何删除div标签之间的不可见空格

7 个答案:

JSFiddle：HERE