读书人

css图层在其它浏览器是正常的firefo

发布时间: 2012-03-14 12:01:12 作者: rapoo

css图层在其它浏览器是正常的,firefox就不行,图文并茂说明,以便理解

CSS code
<style> #picbox div{    width: 120px;    float: left;    height: 120px;    display: table;    text-align: center;    border: solid 1px #C5C5C5;    margin: 7px;    position:fixed;}#picbox div a{    position: absolute;    right: 1px;    bottom: 1px;}#picbox div > img{    position:absolute;    top:0px;    left:0px;    }#picbox div span{    display: table-cell;    vertical-align: middle;}#picbox div span img{    max-height: 110px;    max-width: 110px;}</style><div id="picbox"><div>    <span>        <img src="http://pica.nipic.com/2007-12-24/20071224161811448_2.jpg">    </span>    <img src="/Clt/picmanage/ui/images/checked.png">    <a href="http://pica.nipic.com/2007-12-24/20071224161811448_2.jpg" class="thickbox">        <img src="/Clt/picmanage/ui/images/onebit_02.png" title="查看原图" width="15px">    </a></div></div>


上面这个格式在其它浏览器是正常的,可是在firefox就不行了,看下面的图片:
这个是正常的



这个是firefox下的



[解决办法]
你定位没定好
#picbox div { position:relative;}
你加个这个看看!!
[解决办法]
display:table-cell;
vertical-align:top;
position:relative;
[解决办法]
#picbox div
{
width: 120px;
float: left;
height: 120px;
display: table;
text-align: center;
border: solid 1px #C5C5C5;
margin: 7px;
position:fixed;
}
这个里面有个display:table;去掉他 换种布局方式。这种没必要变成表格吧。一般padding一下就出现空白了。

读书人网 >CSS

热点推荐