アップデート
初めてページを読み込んでこのバグが発生しない場合は、
もう一度ホームページに移動する をクリックすると、バグが表示される可能性が高くなります。（別のページからホームページに戻るたびに、このバグが発生するのが面倒です。）
Chrome 24.0.1312.57 を使用しています。
Chrome は常に、CSS3 をサポートする最も優れたブラウザーの 1 つです。彼女のバグに似た奇妙な行動に遭遇したとき、私はかなりがっかりしました.
CSS3 と jQuery を使用して、いくつかの単純な円形ボタンを手作りしました。(クロスブラウザーの互換性について自分で作業するのが面倒だったので、純粋な Javascript は使用しませんでした。)
ボタンは基本的に、2 つのサブ ディビジョンを含む 1 つのディビジョンで構成され、1 つのサブ ディビジョンには別のサブ ディビジョンも含まれます。そしてそれらはすべて、重ね合わせウィンドウをトリガーするアンカー内にあります。
<a><div class="archbox smaller"><div class="archfacebook"></div>
<div class="archrollerx"><div class="archfacebook below2"></div></div></div></a>
アンカーは単純にスタイル設定されflow:right、これが外部分割のスタイル設定方法です。
-webkit-border-radius: 22px;
border-radius: 22px;
height: width: 44px;
height: 44px;
overflow: hidden;
border: 1px #FFF solid;
position: relative;
何も問題がない場合、これは彼らが休息段階をどのように見るかです:
しかし、ページをロードすると、次のことが発生することがあります。
しかし、ボタンがマウスオーバーされた後、それは再び正常になりました. （あたかも Chrome にバグがあったことを伝えたかのように。）
しばらくは正常でしたが、しばらくするとまた発生しました。
また、マウスオーバーすると余分な境界線が表示されることがあります。
これは、ページが読み込まれるたびに発生する実行時エラーとは異なるため、非常に奇妙な動作です。発生することもあれば、発生しないこともあります。だから直さなきゃいけない気がする。
最初は境界線にバグがあると思ったので、これを追加しました：
border:1px #FFF solid!important;
ボタンの通常の、ホバーおよび訪問済みの状態に。しかし、問題は解決しませんでした。それはまだ頻繁に発生しました。本当にイライラしました。しばらく考えた後、ようやく変位にバグがあることに気付きました。Chrome は「無意識のうちに」Facebook と Twitter のボタンを Twitter と Google のプラス ボタンの後ろに再び表示する傾向があるようです。境界があるような錯覚を与えます。そして、Chromeがこのように動作するのを止める方法がわかりません。
誰かが以前に同じ問題に遭遇したことがありますか? これがまったく起こらないようにするにはどうすればよいですか？
Firefox と Safari を試しましたが、まだこれに遭遇していません。