メニューがホバリングでジャンプする

Question

私はWebアプリケーション（ASP.NET 2.0 C＃）を持っています。私のMasterpageにはメニューコントロールがあり、CSSのスタイルシートを使ってメニューのさまざまな部分をスタイルしています。何らかの理由で、私がメニューの上にマウスを置くと、少しジャンプします。私は何とか境界線が大きくなると思う。

相続人は全体のメニューのためのスタイリング：

は

.menu 
{ 
    width:110%; 
    height:25px; 
    border: 1px solid gray; 
    text-align:center; 
} 

相続人StaticHoverStyleのための私のスタイルは：

.staticMenuHover 
{ 
    background-color:#CCCCCC; 
    border-style:solid; 
    border-color:#888888; 
    text-decoration: underline; 
    border-width:thin; 
} 

私はなぜこれが起こっているかわからない、誰かが助けることができますか？

ありがとうございました

Answer 1

あなたは常にリンク（ないにアンダーラインを追加することができます：あなたはまた、このようなあなたの最初のクラスと、それは一貫性を保つために、単一の行にその第二のクラスの境界ルールを折りたたむことができ

border-width:1px; 

テキスト装飾）、パディングを調整します。作業例：この作品は0ピクセルに2ピクセル下のパディングを変更し、同じルールに2ピクセルの境界線から下を追加します何

#menu ul li a { 
    display: block; 
    width: 95%; 
    padding: 0px 2px 2px 4px; 
    text-decoration: none; 
    color: rgb(30%,30%,60%); background: transparent; 
} 
#menu ul li a:visited { 
    color: rgb(50%,10%,100%); 
} 
#menu ul li a:hover { 
    color: #000; 
    border-bottom: 2px solid #c63; 
    background: #fcf; 
    padding-bottom: 0px; } 

。色の変化は手元の問題とは無関係です。

Answer 2

あなたのテキストに下線が引かれているために起こっています。テキスト装飾なしで試してみてください。問題が解決すると思います。

Answer 3

あなたのホバークラスのボーダー幅は、私のテストで2ピクセルのボーダーとしてレンダリングされている薄いに設定されています。 1pxに設定します。

border:1px solid #888888;