Home > Windows > Opera > ver.9 Under :hover擬似クラス状態になることでマージンの幅が変化する

:hover擬似クラス状態になることでマージンの幅が変化する

マージンの設置状態に異常があるとき（【入れ子関係の要素間で下マージンの相殺が正しく行われない】参照）、a要素の:hover擬似クラスにボーダーなど一部のプロパティを指定すると、マウスポインタを乗せたときにマージンの幅が変化することがある。

Category: Opera, Windows, ver.9 Under
Tag: :hover

例示

<style type="text/css">
<!--
a:hover {
    border-bottom: 2px solid;
}
-->
</style>

<div style="border:2px solid blue;">
    <p style="border:2px solid red;"><a href="./">1</a></p>
    <p style="border:2px solid red;"><a href="./">1</a></p>
</div>
<div style="border:2px solid blue;"><a href="./">2</a></div>

例示には3つのリンクがあります。始めに「2」のリンクにマウスポインタなどを乗せてください。次に、「1」のリンク（2つありますが、どちらでもよいです）にマウスポインタなどを乗せてください。