首页 > Web开发 > 详细

CSS:在IE浏览器下,元素下沉一行的解决办法

时间:2015-12-17 20:43:12      阅读:320      评论:0      收藏:0      [点我收藏+]

HTML:

  <ul>    

    <li><a href="">嘻嘻嘻嘻嘻嘻</a><span>2015-12-17</span></li>
    <li><a href="">嘻嘻嘻嘻嘻嘻</a><span>2015-12-17</span></li>
    <li><a href="">嘻嘻嘻嘻嘻嘻</a><span>2015-12-17</span></li>
    <li><a href="">嘻嘻嘻嘻嘻嘻</a><span>2015-12-17</span></li>

  </ul>

CSS:

  li{
    list-style-type: none;
    margin: 0 10px;
    width: 200px;
    line-height: 20px;

  }

  span{
    float: right;

  }

 

此时在IE7下span元素中的内容会下沉一行,如图:

技术分享

 

解决的办法是:将span元素位置调换到a元素之前即可。

  <li><span>2015-12-17</span><a href="">嘻嘻嘻嘻嘻嘻</a></li>
  <li><span>2015-12-17</span><a href="">嘻嘻嘻嘻嘻嘻</a></li>
  <li><span>2015-12-17</span><a href="">嘻嘻嘻嘻嘻嘻</a></li>
  <li><span>2015-12-17</span><a href="">嘻嘻嘻嘻嘻嘻</a></li>

效果:

技术分享

 

CSS:在IE浏览器下,元素下沉一行的解决办法

原文:http://www.cnblogs.com/wine/p/5055018.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!