布局问题

1、外边距重叠——若两个元素上下毗邻且都定义了不为0的外边距值，同时又没有任何内边距、边框等设定，那么这两个元素之间的距离将小于二者外边距的和。因此，两个都带有20px外边距垂直拼接不会显示出40px的缝隙——最终元素之间的距离只有20px。

对于都为正数的两个外边距定义来说，两个元素之间的距离位二者外边距距离中较大的一个，即外边距要尽可能的重合。

2、假定三个div元素有着同样的宽度，且水平对齐，div两两之间有一条水平缝隙

原因：重叠效果将同时作用于父元素和子元素之上——由于div都没有设定外边距，因此每个div的底部外边距将与其最后一个子元素的底部外边距重叠。因为总共的外边距值并不为零。比方说子元素的10px外边距仍然要被算进去，看上去就是子元素“戳开”了包含它的div父元素。

解决方法：为div添加1px的垂直内边距（padding :1px 0），不再满足形成外边距的条件，div之间的缝隙就消失了 。

3、元素居中——将元素的margin-left和margin-right属性设置为auto，必须为该容器指定固定宽度。

负外边距解决方案：首先创建一个包含居中元素的容器，然后将其绝对定位于相对页面左边缘50%的位置。这样，该容器的左外边距将从页面50%宽度的位置开始算起。

例如：

#container｛

background:#ffc url(mid.jpg) repeat-y center;

position:absolute;

left:50%;

width:760px;

margin-left:-380px;

｝