【发布时间】：2011-01-08 09:02:31
【问题描述】：
我已经开发网站 3 年了，今天发现了一些我无法理解的东西。我正在使用的代码： http://pastie.org/1439629
<!DOCTYPE html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Page Title</title>
<style type="text/css" media="screen">
.box{
margin:50px 0;
background:red;
border:1px solid black;
}
</style>
</head>
<body>
<div class="box">
Y
</div>
<div class="box">
X
</div>
</body>
现在的问题是，我无法弄清楚为什么具有 BOX 类的两个 Div 共享相同的边距空间。即 Y 的下边距与 X 的上边距相同。两者之间不应该有 100 像素的空间而不是 50 像素吗？
编辑： 如果我将 CSS 编辑为
.box{
margin:50px;
background:red;
border:1px solid black;
float:left;
height:50px;
width:50px;
}
那么两者之间的距离应该仍然是50px，但不是！现在它的 100 像素。为什么？
很抱歉问了这么一个琐碎的问题，但我想不通。
【问题讨论】：