0

为什么工具提示（悬停）在 Firefox 和 IE 中出现错误，Chrome 很好

示例http://dabblet.com/gist/3450459

CSS

   .hiq-checkin img { float: left;display: block;margin-right: -2px;}
.visited-profile {float: left;}
.visited-profile a {color: #333 !important;text-decoration:none;position: relative;}
.green-badge {position: relative;z-index: 601;background: url('http://png-3.findicons.com/files//icons/1689/splashy/16/check.png') no-repeat;width: 10px;height: 15px;display: inline-block;float: none;}
.idea-ttip-wrapper {position: absolute;width: 156px;z-index: 602;margin-top: -8px;display: none;margin-left: -53px;}
.ttip-arrow {background: url('http://www.splitbrain.org/_static/ico/semlabs/ico/arrow_up.png');height: 7px;width: 11px;position: absolute;left: 23px;top: -5px;}
.idea-ttip-content {background: #ffffcc;border: 2px solid #cccc99;display: inline-block;text-decoration: none;color: #666;padding: 6px;font-size: 10px;}
.visited-profile a:hover .idea-ttip-wrapper, .visited-profile a:focus .idea-ttip-wrapper {  display: block;}

HTML

<div class="hiq-checkin row-id">
<div class="visited-profile without-photo">
  <a href="#">
  <span class="green-badge"></span> XXXXX,
   <div class="idea-ttip-wrapper">
    <div class="ttip-arrow"></div>
      <div class="idea-ttip-content">
          xxxxx xxxxx<br>
      lorem for ipsum xxx
      </div>
  </div>
  </a>
   <a href="#">
  ZZZZZ,
  </a>
    <a href="#">
  <span class="green-badge"></span> ACSCS
    <div class="idea-ttip-wrapper">
    <div class="ttip-arrow"></div>
      <div class="idea-ttip-content">
          xxxxx xxxxx<br>
      lorem for ipsum xxx
      </div>
  </div>
  </a>
  <span style="line-height: 2.5;"> edfsfsfsdn sdfdsf fsdsdfdfs </span>
</div>

</div>
4

1 回答 1

0

添加

  .idea-ttip-wrapper {
      //your existant css rules
      left:0;
      margin-left:0;
      top:10px; //tweak this to whatever you need
  }

和

visited-profile a {
    color: #333 !important;
    text-decoration: none;
    position: relative;
    display: inline-block;
}

http://dabblet.com/gist/3451092

于 2012-08-24T13:36:57.300 回答