zoukankan      html  css  js  c++  java
  • CSS:在IE浏览器下,元素下沉一行的解决办法

    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;
         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>

    效果:

  • 相关阅读:
    20161203
    20161201
    20161128课堂笔记
    数组排序 (选择排序、冒泡排序、插入排序、希尔排序)
    编一个多用户登陆程序
    20161115课堂笔记
    20161114课堂笔记
    20161111课堂笔记
    面试常见问题
    java 基础第一周
  • 原文地址:https://www.cnblogs.com/wine/p/5055018.html
Copyright © 2011-2022 走看看