私はこれにかなり困惑しています。メイン コンピューターの Chrome、FireFox、IE9、Opera、または Safari で Web ページを表示すると、メニューのロールオーバーに 3px の余分なパディングが表示されます。
家の他の2台のコンピューターをチェックすると、上記のすべてのブラウザー(およびIE8)で、メニューに3pxの余分なパディングがありません.
メインのコンピューターのブラウザーをリセットしましたが、すべてのブラウザーで発生しているため、外部の何かがページのレンダリングに影響を与えているに違いないと考えています...? モニターコンディションではないでしょうか。モニターのキャリブレーションについては、特別なことは何もしていません。私のブラウザーはすべてズーム 100% です。
メイン コンプ: Windows 7 その他の 2 つのコンプ: Windows 7 および Windows XP
これがなぜなのかについての推測は非常に役に立ちます。ありがとう。
CSS:
#access {
clear: both;
display: block;
float: left;
margin: 0px 0 40px 0;
padding:0;
width: 100%;
text-align:left;
/* height:54px; */
background-image:url(images/menu-bar.gif);
background-repeat:no-repeat;
background-position:top center;
}
#access ul {
list-style: none;
margin: 0 0 0 20px;
padding: 0;
width:100%;
}
#access ul li { display:inline;padding:0;margin:0; }
#access li {
background-image:url(images/menu-bar-divider.gif);
background-repeat:no-repeat;
background-position:top right;
}
#access ul li a {
color: #ffffff;
display:block;
float:left;
padding: 18px 39px 17px 39px;
text-decoration: none;
font-size:16px;
text-shadow: 0px 1px #c86209;
}
#access li a:link { }
#access li:last-child { background-image:none; }
#access a:hover { text-shadow: none;background-image:url(images/menu-bar-hover.gif);background-repeat:repeat-x;background-position:bottom center;color:#000000!important;}
#access a:visited { color:#ffffff!important;}