这个bug不是普遍的，有些浏览器有，有些没有(记不着哪些有了，你可以自己测试)
外边距自动合并的原理：
<div id="txt">
<p>一篇文章，结构很可能是这样</p>
<p>这篇文章有很多段落，这是第二段文字</p>
<p>段落.......</p>
</div>
这时候为了文字排版好看，通常都会给给 p 来点上、下外边距，让段落间拉出段空白来。比如给 p 上、下各 15px 的外边距：
#txt p{margin:15px 0}
这时两个挨着的段落之间的空白部分距离是多少？
第一段下边距 15px + 第二段上边距 15px = 30px 加起来等于 30px 对不？等于 30px 的话排版就难看了。
实际上浏览器为了解决这个排版问题，把这两个边距强制合并了(而不是简单的做加法运算)，实际上下两段之间距离是：15px
这个就是：外边距自动合并，是一个很有用的功能，基本上能解析 css 的浏览器都能自动合并这种外边距。
然后你遇到的错误是：某些浏览器在不该 自动合并外边距时 去帮你合并了，合并的顺序是把下面一块往上面挤，就挤到父元素的外边去了。
其实A是不可能倒DIV外面去的！你的理解错了~，A和B一直在父层里面，在没有被selected的时候大家都是一样的，所有的H1都只占H1高度的一半，估计是用了PADDING-TOP,然后背景放在H1的下半部，在选中某个选项标签的时候重写它的CSS，让背景占满整个H1，PADDING-TOP:0文字位置上移，看起来的效果就是A在DIV外边了！！！其实父层DIV一直是个大框架！你看到的超出部分也在它的管辖范围！！！
