リンクされた画像の下に余白がある

Question

どこにでも見えて、これに対する答えが見つからない場合は、誰も同じ問題を抱えていない可能性があります。

私がやっている問題は、私が取り組んでいるサイトのリンクされたイメージが、上に乗ったときに小さな境界線があることです。これはすべてのブラウザにあります（IE 7は別として、に）。これは、hoverを背景として設定しているためです。ボーダー、余白、画像へのパディングは設定されていないにもかかわらず、何らかの理由でまだ満足していません。

私はそれを解決する方法、特定のタグに背景を持たないクラスを設定する方法、またはリンクされた画像をブロックとして表示する方法しかありません。残念なことに、これらのソリューションはどちらも適していません。なぜなら、サイトには何百ものページがあり、何千ものリンクされたイメージがあり、クラスを使用するとそれらをすべて見つけることができるからです。表示ブロックを使用すると、pタグにうまく中心が合ったときのように、画像の表示の一部が破損します。

私のために働いていない例をお伝えしたい場合は、問題のサイトのホームページはhttp://www.tameside.gov.ukです。右上のソーシャルメディアのアイコンを見ると、彼らはすべて背景のホバー処理を受けています。

誰かが私が本当に感謝してくれるのを助けることができたら。

ありがとう、

Answer 1

イメージアイコンはPNGで、背景が透明です。だから、あなたは背景を見ることができます。 アイコンを白い背景（JPEGと同じ）に変更すると、背景が表示されなくなります。

速い修正では、ソーシャルメディアのdiv内のAタグにのみ適用され、新しいCSSルールを追加するには、次のようになります。

.banner_container .social a { 
    background: none !important; 
}