遇到一个兼容性问题不知道是怎么回事,谁知道告我一下

Question

遇到一个兼容性问题不知道是怎么回事,谁知道告我一下
http://06.fx.sx2s.net/index.p...

p多出来的距离是怎么回事呀？我有没设置高度，它不是应该跟着内容高度一样吗？font-size:0px;也关用。
代码如下：
<div style="width:100%;overflow:hidden;text-align:center;">

    <section style="margin:25px 10px;font-size:0px;width:42%;text-align:center;float:left;padding-bottom:5px;background-color:#fffe03;color:#000000;line-height:25px;text-align:center;">
    <p style="width:100%;text-align:center;">
        <a style="font-size:0px;" href="http://06.fx.sx2s.net/uploads/x/xvhcmf1479715529/7/9/c/d/585b80ac5db06.jpg"> 
            <img style="width:100%;margin-bottom:2px;" src="http://06.fx.sx2s.net/uploads/x/xvhcmf1479715529/7/9/c/d/585b80ac5db06.jpg" alt="" /> 
        </a></p><span style="font-size:18px;">1:1实景模拟放线工艺
    </span></section>


<section style="margin:25px 10px;font-size:0px;width:42%;text-align:center;float:left;padding-bottom:5px;background-color:#fffe03;color:#000000;line-height:25px;text-align:center;">
<p style="width:100%;text-align:center;">
    <a style="font-size:0px;" href="http://06.fx.sx2s.net/uploads/x/xvhcmf1479715529/c/b/7/2/585b80ad09c40.jpg"> 
    <img style="width:100%;margin-bottom:2px;" src="http://06.fx.sx2s.net/uploads/x/xvhcmf1479715529/c/b/7/2/585b80ad09c40.jpg" alt="" /> 
    </a></p><span style="font-size:18px;">无齿锯切割、开槽工艺
</span></section>

<section style="margin:25px 10px;font-size:0px;width:42%;text-align:center;float:left;padding-bottom:5px;background-color:#fffe03;color:#000000;line-height:25px;text-align:center;"><p style="width:100%;text-align:center;">

<img style="width:100%;margin-bottom:2px;" src="http://06.fx.sx2s.net/uploads/x/xvhcmf1479715529/6/6/0/2/585b80add0214.jpg" alt="" /> </a></p><span style="font-size:18px;">专业水电路改造施工工艺

</span></section>

<section style="margin:25px 10px;font-size:0px;width:42%;text-align:center;float:left;padding-bottom:5px;background-color:#fffe03;color:#000000;line-height:25px;text-align:center;"><p style="width:100%;text-align:center;">
<img style="width:100%;margin-bottom:2px;" src="http://06.fx.sx2s.net/uploads... alt="" /> </p><span style="font-size:18px;">阴阳角处理施工工艺
</span></section>

<section style="margin:25px 10px;font-size:0px;width:42%;text-align:center;float:left;padding-bottom:5px;background-color:#fffe03;color:#000000;line-height:25px;text-align:center;"><p style="width:100%;text-align:center;">
<img style="width:100%;margin-bottom:2px;" src="http://06.fx.sx2s.net/uploads... alt="" /> </p><span style="font-size:18px;">隔音降噪处理施工工艺
</span></section>

<section style="margin:25px 10px;font-size:0px;width:42%;text-align:center;float:left;padding-bottom:5px;background-color:#fffe03;color:#000000;line-height:25px;text-align:center;"><p style="width:100%;text-align:center;">
<img style="width:100%;margin-bottom:2px;" src="http://06.fx.sx2s.net/uploads... alt="" /> </p><span style="font-size:18px;">卫生间暗地漏防漏施工工艺
</span></section>

<section style="margin:25px 10px;font-size:0px;width:42%;text-align:center;float:left;padding-bottom:5px;background-color:#fffe03;color:#000000;line-height:25px;text-align:center;"><p style="width:100%;text-align:center;">
<img style="width:100%;margin-bottom:2px;" src="http://06.fx.sx2s.net/uploads... alt="" /> </p><span style="font-size:18px;">防返味逆止阀专利工艺
</span></section>

<section style="margin:25px 10px;font-size:0px;width:42%;text-align:center;float:left;padding-bottom:5px;background-color:#fffe03;color:#000000;line-height:25px;text-align:center;"><p style="width:100%;text-align:center;">
<img style="width:100%;margin-bottom:2px;" src="http://06.fx.sx2s.net/uploads... alt="" /> </p><span style="font-size:18px;">细木工板柜体制作工艺
</span></section>
</div>

Answer 1

p 不要用line-height
a{display: block}
里面的span 可以在包一层p 这个p 给lineheight

Answer 2

因为你把img元素放在p元素下，默认在p元素下的子元素都是vertical-align:baseline,你给img设一个vertical-align:bottom就好了