龙盟编程博客 | 无障碍搜索 | 云盘搜索神器
快速搜索
主页 > web编程 > div+css/html >

div兼容底部距离高度问题

时间:2009-12-21 11:47来源:未知 作者:admin 点击:
分享到:
先来看下图: CSS中设置各图片按钮margin:0px 8px 5px 0px;在IE 8中就有效果距离5px,但在IE6与IE7中就没有效果了,那怎么办呢?那就是在三个图片按钮的外层DIV设置padding-bottom:5px;margin-bottom

先来看下图:

CSS中设置各图片按钮margin:0px 8px 5px 0px;在IE 8中就有效果距离5px,但在IE6与IE7中就没有效果了,那怎么办呢?那就是在三个图片按钮的外层DIV设置padding-bottom:5px;margin-bottom:5px; 一定要设置这两项,少了其中一项在IE6与IE7都不会有效果,css在各浏览器兼容还真是个问题,下面是源码:

HTML代码:

<div class="diggBody">
  <a href="#digg" title="投票: ">
   <div class="diggclick">
   <div style="border:1px solid #40A300;width:50px;height:5px;float:left;"><img src="/images/diggLine.gif" height="5" width="30%" border="0" /></div><span>30%(3000)</span>
   </div>
  </a>
  <a href="#offdigg">
   <div class="offclick">
   <div style="border:1px solid #555555;width:50px;height:5px;float:left"><img src="/images/offLine.gif" height="5" width="60%" border="0" /></div><span>30%(3000)</span>
   </div>
  </a>
  <div class="favclick">立即</div>
</div>

css:

.diggBody{
padding-left:115px;
padding-bottom:5px;
margin-bottom:5px;
}
.diggBody span{font-size:9px;}
.diggclick{
text-align:left;
float:left;
background:url(../diggnum.gif);
width:160px;
height:20px;
padding:28px 0px 0px 10px;
margin:0px 8px 5px 0px;
}
.offclick{
text-align:left;
float:left;
background:url(../offnum.gif);
width:160px;
height:20px;
padding:28px 0px 0px 10px;
margin:0px 8px 5px 0px;
}
.favclick{
text-align:left;
float:left;
background:url(../favnum.gif);
width:100px;
height:20px;
padding:28px 0px 0px 30px;
margin:0px 8px 5px 0px;
}

 

精彩图集

赞助商链接