布局中慎用段落<p>

问题描述：

      在一个按 左 中 右 三列布局的门户中， 里面的内容模块都是用同一个主题展现的。

     1. 在IE6中不存在问题；

     2. IE8 兼容性视图模式，左边的内容模块的边框，标题栏比其他部分宽了1像素 1px；中间和右边的内容模块显示正常

     3. IE9 兼容性视图模式，右边的内容模块的边框，标题栏比其他部分宽了1像素 1px；左边和中间的内容模块显示正常

     4. IE8 非兼容性模式，内容模块的标题栏高度高于设置高度（多亏了这，我才找到了原因）；

问题的原因：

      原来是标题栏的文字部分，容器用了段落<p> 的原因造成的。

问题解决方式：

     用<span> 替换<p> (用<div> 测试也可以)

问题深究：

（网上找的span div p 的区别）

span和div的不同之处在于span是内联的，用在一小块的内联HTML中，前后不断行.
div（想想division是什么意思）元素是块级的（简单地说，它等同于其前后有断行），用于组合一大块的代码。
p(段落)元素是块级的,前后断行,而且还要再隔一行.相当于断两行.

<span> 标签被用来组合文档中的行内元素。

 
<p> 标签定义段落。
p 元素会自动在其前后创建一些空白。浏览器会自动添加这些空间，您也可以在样式表中规定。

图片显示一下效果，<p> 不是单纯的换行而已：