0

我有这个网站：www.canalonesbastimar.com我试图将 facebook 按钮放在 IE7 中的电话号码下方，但我不能.. 我使用容器的相对位置和 facebook 按钮的绝对位置..

<div class="tel-fb">
    <div class="telicon my-icons-telicon" style="float: left"></div>
    <div id="tel" itemscope itemtype="http://schema.org/HomeAndConstructionBusiness">
      <div itemprop="telephone" class="telephone">
        <a href="tel:+622585749">622 585 749</a>
      </div>
      <div itemprop="telephone" class="telephone">
        <a href="tel:+636740393">636 740 393</a>
      </div>
    </div>
    <div class="fb-like" data-href="http://www.facebook.com/canalonesbastimar" data-send="false" data-layout="box_count" data-width="450" data-show-faces="false"></div>
</div>


  .tel-fb {
    float: right;
    display: inline-block;
    position: relative;
    z-index: 99;
    #tel {
      float: right;
      a {
        font-size: 29px;
        color: #009846;
        font-weight: bold;
      }
    }
    .fb-like {
      position: absolute;
      top: 250px;
      right: 3px;
    }
  }

更新：

我终于为 facebook like 按钮添加了一个包装器：

<head>
<style type="text/css">
.tel-fb {
  float: right;
  display: inline-block;
  position: relative;
  z-index: 99;
}

#tel {
  float: right;
}

#tel a {
  font-size: 29px;
  color: #009846;
  font-weight: bold;
}

.wrapper {
  position: absolute;
  top: 50px;
}
.jander {
  background: red;
}
.zero {
    margin-left: 50px;
  position: relative;
  background: red;
  width: 100px;
  height: 100px;
}
.one {
  position: absolute;
  top:50px;
}
</style>
</head>
<body>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/es_ES/all.js#xfbml=1&appId=151887748332358";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="zero">

    <div class="wrapper">
      <div class="fb-like" data-href="http://www.facebook.com/canalonesbastimar" data-send="false" data-layout="box_count" data-width="450" data-show-faces="false"></div>
</div>
<div class="one">jfklas</div>
</div>
    <div class="tel-fb">
      <div class="telicon my-icons-telicon" style="float: left"></div>
      <div id="tel" itemscope itemtype="http://schema.org/HomeAndConstructionBusiness">
        <div itemprop="telephone" class="telephone">
          <a href="tel:+622585749">622 585 749</a>
        </div>
        <div itemprop="telephone" class="telephone">
          <a href="tel:+636740393">636 740 393</a>
        </div>
      </div>
    </div>
</body>
4

1 回答 1

0

您的课程的所有 css.fb-like都不起作用，因为您已将其放在.tel-fbcss 课程的括号内。

所以这;

.tel-fb {
    float: right;
    display: inline-block;
    position: relative;
    z-index: 99;
    #tel {
      float: right;
      a {
        font-size: 29px;
        color: #009846;
        font-weight: bold;
      }
    }
    .fb-like {
      position: absolute;
      top: 250px;
      right: 3px;
    }
  }  // <--- Notice bracket here putting .fb-like and #tel inside .tel-fb

应该是这个；

.tel-fb {
  float: right;
  display: inline-block;
  position: relative;
  z-index: 99;        
}

#tel {
  float: right;
}

#tel a {
  font-size: 29px;
  color: #009846;
  font-weight: bold;
}

.fb-like {
  position: absolute;
  top: 250px;
  right: 3px;
}

值得注意的是，您的#telcss 也在tel-fb类中，这意味着 CSS 可能也不起作用。

于 2013-10-01T08:38:07.457 回答