Question

我有一个简单的问题，我的div中的东西并非没有边距。具体来说，当设置margin，padding和border all为0时，元素之间仍然有空格

代码：

<div id="menu" >
<a href="#" style="margin:0;border:0;padding:0;background:red">sup</a>

<a href="#" style="margin:0;border:0;padding:0;background:red">sup</a>

</div>

只需将这些代码添加到空文本文件并保存为html，元素之间就会有空格，除非我专门设置了负边距。这样可行，但我只是想知道为什么在专门设置为0时它不是0。

提前致谢：D

新发现：

我试图将上面的内容显示出来：当我发现

时阻止显示一个在另一个上面

添加后：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

它不起作用

我本来应该使用这个doctype但它现在不起作用。

任何解决方案？

代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<div id="kingmenu"  style="position:absolute;top:90px;left:290px;width:55px;">
<a href="#"><img src="http://white-attic.com/themes/prestashop/img/kingtop.png"></a><a href="#"><img src="http://white-attic.com/themes/prestashop/img/kingbottom.png"></a>
</div>

问题如此screencap中所示： http://img828.imageshack.us/img828/8331/whitespace.jpg

Answer 1

空白在你的标记中。

即使您将a元素设置为inline-block（默认情况下不是这些元素），您仍会看到HTML中的（规范化）空间。

要消除这种情况，你必须将元素“对接”起来。

更新：您的文件现在应如下所示：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<div id="menu" ><a href="#" style="margin:0;border:0;padding:0;background:red">sup</a><a href="#" style="margin:0;border:0;padding:0;background:red">sup</a></div>

我已经在Chrome，Firefox 6和IE 8中检查过链接之间没有空格。

Answer 2

这是因为基本上你只是添加一个空格。 Div是一个块元素，a是一个内联元素，所以基本上两个内联元素都是间隔的。

请记住，浏览器会解释空格。

Answer 3

这是因为HTML中的新行在渲染时被解释为空格。

试试这个：

<div id="menu" >
<a href="#" style="background:red">sup</a><a href="#" style="background:red">sup</a>
</div>

具体设置为0时，边框/边距/填充不为0

3 个答案: