13

AddThis フォーラムでこの質問をしましたが、今のところ回答がありません。うまくいけば、誰かがこれについて私を助けてくれます。

問題のページはhttp://preview.ami.co.nz/productsの右下にあります。

  • ChromeまたはFirefoxで表示すると、オレンジ色の「+」AddThis ボタンの左側に「Share」という単語が表示されます。

  • ただし、IE (少なくとも IE8 および 6) では、「共有」という単語が右側にあります。Chrome と FF のように見えるはずですが、IE が何をしているのかわかりません。

    ここに画像の説明を入力 ここに画像の説明を入力

さらに奇妙なことに、別のページのまったく同じコードが、すべてのブラウザーで正しく表示されます。http://preview.ami.co.nzをご覧ください

どんな提案でも大歓迎です。

PS。これらのページに付けたマークアップは次のとおりです。

<!-- AddThis Button BEGIN -->
  <div class="addthis_toolbox addthis_default_style" style="display: <%= SocialMediaVisibility %>">
    <a class="addthis_button_compact">Share</a>
    <a class="addthis_button_facebook"></a>
    <a class="addthis_button_twitter"></a>
    <a class="addthis_button_email"></a>
  </div>
  <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4e0a5ac2480330c8"></script>
<!-- AddThis Button END -->
4

8 に答える 8

1

これを試してみてください

.at300bs.at15nc.at15t_compact { float:right; }

何らかの理由で、IEはセレクターを動かして、右ではなく左にフロートさせています。

于 2011-08-04T05:04:38.673 に答える
1 
.addthis_default_style .at15t_compact
{
    float: right !Important;

}

重要な部分は「！重要」です

この奇妙なIEの不具合を修正する必要があります。

于 2011-08-19T18:37:14.130 に答える
1

WebサイトのHTMLをから変更するだけです

<a class="...">
<span class="the_icon_class"></span>
share
</a>

に

<a class="...">
<span>share</span>
<span class="the_icon_class"></span>
</a>
于 2011-07-21T20:39:05.950 に答える
1

http://preview.ami.co.nz/styles/ami.cssファイルに以下のスタイルがあります

.addthis_default_style .at15t_compact
{
    float: right;
    margin-left: 4px;
    margin-right: 0;
}

FFでは共有リンクのスパンが使用されてfloat: rightいますが、IEではスパンが正しくフロートされていません。このため、addthisボタンの右側に共有テキストが表示されています。

正しくフロートするために重要なものを追加することはあなたを助けると思います。

  float: right !important;

それ以外の場合は、IE固有のスタイルを使用します。http://css-tricks.com/132-how-to-create-an-ie-only-stylesheet/およびhttp://webdesignerwall.com/tutorials/css-specific-for-internet-explorerを確認してください

于 2011-08-04T04:30:56.100 に答える
1

これでうまくいくはずです。このルールをスタイルシートの最後に追加するだけです:

.addthis_default_style.addthis_toolbox span{
    line-height: 16px;
    float: right; /* this will move the span back over to the right */
}
于 2011-08-02T03:27:49.040 に答える
1

CSS に「!important」を追加すると、Matthew と Pavel の両方のソリューションが機能します。

または、「共有」という単語を別のボタンに移動することもできます。

<div class="addthis_toolbox addthis_default_style">
  <a class="addthis_button" style="float: left">Share</a>
  <a class="addthis_button_compact"></a>
  <a class="addthis_button_facebook"></a>
  <a class="addthis_button_twitter"></a>
  <a class="addthis_button_email"></a>
</div>

また、「addthis_default_style」クラス名を削除し、スタイルを自分で定義することを検討することもできます (AddThis が CSS を変更した場合の問題を回避するため)。これは次のようになります。

<div class="addthis_toolbox">
  <a class="addthis_button">Share</a>
  <a class="addthis_button_compact"></a>
  <a class="addthis_button_facebook"></a>
  <a class="addthis_button_twitter"></a>
  <a class="addthis_button_email"></a>
</div>

<style>
  .addthis_toolbox {
    margin-top: -27px;
    float: right;
  }
  .addthis_toolbox a {
    display: block;
    float: left;
    margin-left: 5px;
  }
</style>
于 2011-08-21T07:53:04.520 に答える
1

class@DanyW、私はあなたのウェブサイトのコードがあなたの仕様に問題があるかもしれないのを見ました。商品ページでは&で指定float:rightします。したがって、firefox と chrome では取得され、IE では取得され、他のページで正常に動作します。これは、指定した製品ページの理由よりもはるかに明確なクラスを指定するためです。優先順位が高くなります。.addthis_default_style .at15t_compactfloat:left .addthis_default_style .at300bsfloat:rightfloat:leftfloat:right#pageBottom .footerPanel .addthis_default_style .at15t_compactfloat:right

解決策：これを書いてください

#pageBottom .footerPanel .addthis_default_style .at15t_compact{float:right}

商品ページで

またはあなたはこれをします

.addthis_default_style .at15t_compact{float:right !important}
于 2011-07-27T09:29:09.187 に答える
0

これはフロートの古い問題です。実際、ie9でもそれを持っています。あなたはそれを修正するためにいくつかのスタイルを追加することができます：

.addthis_button_compact{
    position: relative;
    padding:0 23px 0 0;
}
.addthis_button_compact span{
    position:absolute;
    right:0;
}
于 2011-07-21T22:13:51.770 に答える