灰色の背景色がGoogle Chromeでのみ表示されるのはなぜですか？

Question

他のブラウザではまったく問題ありません。しかし、chroomでメニューの灰色の背景色が表示されたら、メニューからマウスを完全に移動するか、部分的に消えるときに表示されます。火かき棒で要素を調べると、完全に消えます。 ここに画像があります。 ページのCss

body 
{ 
    font-size: .80em; 
    font-family: "Helvetica Neue" , "Lucida Grande" , "Segoe UI" , Arial, Helvetica, Verdana, sans-serif; 
    background-color: #d0e2e0; 
    background-repeat: repeat-x; 
    background-image: url('../images/bar6.png'); 
} 
.logout 
{ 
    color: #666666; 
    text-decoration: none; 
} 
.logout:hover 
{ 
    color: #000; 
} 
fieldset 
{ 
    border-radius: 6px; 
} 
.ptext 
{ 
    font-size: 11px; 
} 
fieldset legend 
{ 
    font-size: 14px; 
    font-weight: bold; 
    color: #4b4b4d; 
    font-family: Calibri; 
} 
img 
{ 
    border-width: 0px; 
} 
.mainmenu 
{ 
    background-color: #468B6A; 
    margin-top: -50px !important; 
    width: 74%; 
    background-size: 1% 100%; 
    background-image: url('../images/bar.png'); 
} 
.clear 
{ 
    clear: both; 
} 
.footer 
{ 
    margin: 5px auto 5px auto; 
    width: 960px; 
    text-align: center; 
} 
.btn 
{ 
    padding: 4px 10px; 
} 

input[type=submit], input[type=button] 
{ 
    background-image: url('../images/bar1.png'); 
    background-size: 1% 100%; 
    background-color: #D6DD51; 
    border: 1px solid #91cda0; 
    border-radius: 4px 4px 4px 4px; 
    color: #4b4b4d; 
    font-family: calibri; 
    font-size: 13px; 
    font-weight: bold; 
    padding: 4px 10px; 
} 
input[type=submit]:hover, input[type=button]:hover 
{ 
    border-color: #ffcc28; 
    background-image: none; 
    background-color: #D6DD51; 
    color: #4b4b4d; 
    cursor: pointer; 
} 

.reportheader 
{ 
    height: 35px; 
    background-image: url('../images/bar.png'); 
    background-size: 1% 100%; 
    color: #FFFFFF; 
    vertical-align: middle; 
    padding: 10px; 
    border-radius: 6px 6px 0px 0px; 
} 
.pageheader 
{ 
    height: 80px; 
    color: #666666; 
    vertical-align: middle; 
    padding: 10px; 
    border-radius: 6px 6px 0px 0px; 
} 
.page 
{ 
    margin: 5px auto 30px auto; 
    width: 960px; 
    border: 1px Solid #cccccc; 
    border-radius: 6px; 
    min-height: 600px; 
    background-color: #FFF; 
} 

.fullWidth 
{ 
    width: 100%; 
} 
.alignLeft 
{ 
    text-align: left; 
} 
.alignRight 
{ 
    text-align: right; 
    vertical-align: text-top; 
} 
.alignCenter 
{ 
    text-align: center; 
    vertical-align: text-top; 
} 
label 
{ 
    font-size: 11px; 
    font-weight: bold; 
    color: #666; 
} 
.textBox, .textArea, .email, .dropdown, .smalltext, .verysmalltext, .listbox, .comment 
{ 
    border: 1px solid #CCCCCC; 
    border-radius: 4px; 
    height: 22px; 
} 

.msgSucess 
{ 
    color: #2B7F10; 
} 
.msgError 
{ 
    color: #800000; 
} 
.textBox 
{ 
    width: 250px; 
} 

.textArea 
{ 
    width: 732px; 
    height: 272px; 
} 
.email 
{ 
    width: 250px; 
} 
.smalltext 
{ 
    width: 150px; 
} 

.verysmalltext 
{ 
    width: 100px; 
} 

.dropdown 
{ 
    width: 153px; 
} 






.textBox:hover, .textArea:hover, .email:hover, .dropdown:hover, .smalltext:hover, .verysmalltext:hover, .listbox:hover 
{ 
    background-color: #F4F4F4; 
    border: 1px solid #909090; 
} 



.validator 
{ 
    color: #FF2828; 
} 








.floatLeft 
{ 
    text-align: right; 
    float: left; 
    width: 20%; 
} 
.floatRight 
{ 
    float: right; 
    width: 78%; 
} 
.floatRight .textBox, .textArea, .dropdown, .smalltext, .verysmalltext 
{ 
} 


.floatLeft p 
{ 
    margin-top: 0px; 
} 
.listbox 
{ 
    margin-top: 3px; 
    border: 1px solid #CCCCCC; 
    background-color: #F0F0F0; 
    padding: 5px; 
    width: 200px; 
} 


.mainDiv 
{ 
    padding: 10px; 
    width: 100%; 
} 


.errorMessage 
{ 
    color: #D8000C; 
    border: 1px solid #FF4F4F; 
    background-color: #FFE8E1; 
    height: 50px; 
    width: 400px; 
} 

.highlightValidator 
{ 
} 
.CustomValidator 
{ 
} 


.KimsCustomCalloutStyle div, .KimsCustomCalloutStyle td 
{ 
    border: solid 1px #CCCCCC; 
    background-color: #F3F3F3; 
    color: #666666; 
} 
.KimsCustomCalloutStyle .ajax__validatorcallout_popup_table 
{ 
    display: none; 
    border: none; 
    background-color: transparent; 
    padding: 0px; 
} 
.KimsCustomCalloutStyle .ajax__validatorcallout_popup_table_row 
{ 
    vertical-align: top; 
    height: 100%; 
    background-color: transparent; 
    padding: 0px; 
} 
.KimsCustomCalloutStyle .ajax__validatorcallout_callout_cell 
{ 
    width: 20px; 
    height: 100%; 
    text-align: right; 
    vertical-align: top; 
    border: none; 
    background-color: transparent; 
    padding: 0px; 
} 
.KimsCustomCalloutStyle .ajax__validatorcallout_callout_table 
{ 
    height: 100%; 
    border: none; 
    background-color: transparent; 
    padding: 0px; 
} 
.KimsCustomCalloutStyle .ajax__validatorcallout_callout_table_row 
{ 
    background-color: transparent; 
    padding: 0px; 
} 
.KimsCustomCalloutStyle .ajax__validatorcallout_callout_arrow_cell 
{ 
    padding: 8px 0px 0px 0px; 
    text-align: right; 
    vertical-align: top; 
    font-size: 1px; 
    border: none; 
    background-color: transparent; 
} 
.KimsCustomCalloutStyle .ajax__validatorcallout_callout_arrow_cell .ajax__validatorcallout_innerdiv 
{ 
    font-size: 1px; 
    position: relative; 
    left: 1px; 
    border-bottom: none; 
    border-right: none; 
    border-left: none; 
    width: 15px; 
    background-color: transparent; 
    padding: 0px; 
} 
.KimsCustomCalloutStyle .ajax__validatorcallout_callout_arrow_cell .ajax__validatorcallout_innerdiv div 
{ 
    height: 1px; 
    overflow: hidden; 
    border-top: none; 
    border-bottom: none; 
    border-right: none; 
    padding: 0px; 
    margin-left: auto; 
} 
.KimsCustomCalloutStyle .ajax__validatorcallout_error_message_cell 
{ 
    font-family: Tahoma; 
    font-size: 11px; 
    padding: 5px; 
    border-right: none; 
    border-left: none; 
    width: 100%; 
} 
.KimsCustomCalloutStyle .ajax__validatorcallout_icon_cell 
{ 
    width: 20px; 
    padding: 5px; 
    border-right: none; 
    border-radius: 5px 0 0 5px; 
} 
.KimsCustomCalloutStyle .ajax__validatorcallout_close_button_cell 
{ 
    vertical-align: top; 
    padding: 0px; 
    text-align: right; 
    border-left: none; 
    border-radius: 0 5px 5px 0; 
} 
.KimsCustomCalloutStyle .ajax__validatorcallout_close_button_cell .ajax__validatorcallout_innerdiv 
{ 
    border: none; 
    text-align: center; 
    width: 10px; 
    padding: 1px; 
    cursor: pointer; 
    border-radius: 0 5px 0 0; 
} 




.comment 
{ 
    height: 220px; 
    width: 650px; 
} 

.round 
{ 
    border: 1px solid #CCCCCC; 
    border-radius: 6px 6px 6px 6px; /* margin: 15px 0;    */ 
    padding: 10px; 
    width: 100%; 
    box-shadow: 2px 2px 2px #CCCCCC; 
    min-height: 100px; 
} 
.imageCss 
{ 
    width: 50px; 
    height: 50px; 
} 
.userName 
{ 
} 

.imageCss:hover 
{ 
} 

.thumbnail 
{ 
} 

.hide 
{ 
    display: none; 
} 
.sqaText 
{ 
    border: 1px solid #CCCCCC; 
    border-radius: 4px; 
    height: 22px; 
    width: 200px; 
    box-shadow: 1px 1px 1px #CCCCCC; 
} 
.sqaSmallText 
{ 
    border: 1px solid #CCCCCC; 
    border-radius: 4px; 
    height: 22px; 
    width: 200px; 
    box-shadow: 1px 1px 1px #CCCCCC; 
} 
.sqafullWidth 
{ 
    width: 100%; 
} 
.sqafullWidth .alignRight 
{ 
    vertical-align: middle; 
} 


.edit 
{ 
    background-image: url('../Images/edit 16x16.png'); 
    background-repeat: no-repeat; 
    background-position: left center; 
    border: 1px solid #CCCCCC; 
    border-radius: 4px 4px 4px 4px; 
    box-shadow: 1px 1px 1px #CCCCCC; 
    padding: 5px 26px; 
    text-decoration: none; 
} 
.delete 
{ 
    background-image: url('../Images/delete 16x16.png'); 
    background-repeat: no-repeat; 
    background-position: left center; 
    border-radius: 4px 4px 4px 4px; 
    border: 1px solid #CCCCCC; 
    box-shadow: 1px 1px 1px #CCCCCC; 
    padding: 5px 26px; 
    text-decoration: none; 
} 
.delete:hover 
{ 
    border: 1px solid #808080; 
    box-shadow: 1px 1px 1px #808080; 
} 
.edit:hover 
{ 
    border: 1px solid #808080; 
    box-shadow: 1px 1px 1px #808080; 
} 

.tblconfirm tr th 
{ 
    display: none; 
} 
.tblconfirm 
{ 
    width: 100%; 
} 
.tblconfirm td:first-child 
{ 
    background-color: #E4E4E4; 
    width: 30%; 
    text-align: right; 
} 
.tblconfirm td:last-child 
{ 
    background-color: #E4E4E4; 
    font-weight: bold; 
} 
.number 
{ 
} 
.alphabet 
{ 
} 

.fright 
{ 
    float: right; 
} 
.fleft 
{ 
    float: left; 
} 
.aright 
{ 
    text-align: right; 
} 
.aleft 
{ 
    text-align: left; 
} 
.nic 
{ 
} 
#printbtn 
{ 
    background-image: url("../images/print_32.png"); 
    background-position: left center; 
    background-repeat: no-repeat; 
    border: 2px solid #D2DA41; 
    border-radius: 6px 6px 6px 6px; 
    color: green; 
    font-family: calibri; 
    font-size: 21px; 
    font-weight: bold; 
    padding: 3px 40px; 
    text-align: center; 
    text-decoration: none; 

} 
#printbtn:hover 
{ 
    background-color: #F1F3C2; 
    border-color: #F0F000; 
} 
.validator-error 
{ 
    border-color:Red; 
    } 


    .test 
{ 
    background-color: #FFF2F2; 
} 

メニューのCss

.grid_12 { 
    display: inline; 
    float: left; 
    margin-left: 5px; 
    margin-right: 20px; 
    position: relative; 
} 
#ns_nav-main li li.ns_last { 
    border-bottom: 1px solid #009BE2; 
} 
#ns_nav-sub-wrap { 
    border: 1px solid #CCCCCC; 
    display: block; 
    margin-bottom: 10px; 
    margin-top: 10px; 
    position: relative; 
    z-index: 2; 
} 
#ns_nav-sub { 
    font-family: Calibri,Arial; 
    font-size: 14px; 
    list-style: none outside none; 
} 
#ns_nav-sub a:hover { 
    background-color:#dfe473; 

    color:#4b4b4d; 
    text-decoration: none; 
} 
#ns_nav-sub li:first-child a:hover { 
    background-color:#dfe473; 


    color:#4b4b4d; 
    text-decoration: none; 
    border-radius: 5px 0 0 5px; 
} 
#ns_nav-sub li li:first-child a:hover 
{ 
    border-radius: 0px; 

    } 
#ns_nav-sub li { 
    border-left: 1px solid #CCCCCC; 
    float: left; 
    margin: 0; 
    position: relative; 
} 
#ns_nav-sub li.ns_first { 
    border-left: 0 none; 
} 
#ns_nav-sub li a { 
border-left:none; 
    color: #FFFFFF; 
    cursor: pointer; 
    display: block; 
    padding: 10px 20px; 
    text-decoration: none; 
    font-weight:bold; 
} 
#ns_nav-sub li:hover, #ns_nav-sub li.selected, #ns_nav-sub li.over 
{ 
    /* background: none repeat scroll 0 0 #EFEFEF;*/ 
    text-decoration: none; 

} 
#ns_nav-sub .ns_icon-tiny { 
    background-position: -1000px -17px; 
    position: absolute; 
    right: 12px; 
    top: 22px; 
} 
#ns_nav-sub li ul { 
    -moz-border-bottom-colors: none; 
    -moz-border-image: none; 
    -moz-border-left-colors: none; 
    -moz-border-right-colors: none; 
    -moz-border-top-colors: none; 

    background-color:#468B6A; 
    border-color: #CCC; 
    border-style: none solid solid; 
    border-width: 0 1px 1px; 
    display: none; 
    list-style: none outside none; 
    margin-left: -1px; 
    position: absolute; 
    width: 200px; 
    z-index: 10; 
} 
#ns_nav-sub li:hover ul, #ns_nav-sub li.over ul { 
    display: block; 
} 
#ns_nav-sub li li { 
    border-left: 0 none; 
    border-top: 1px solid #CCCCCC; 
    width: 100%; 
} 
#ns_nav-sub li li a { 
    padding-bottom: 10px; 
    padding-top: 10px; 
} 
#ns_nav-sub li li a:hover { 
     background-color:#dfe473; 

    color:#4b4b4d; 

} 
#ns_nav-sub li li:last-child a:hover { 
     background-color:#dfe473; 
    color:#4b4b4d; 
    border-radius: 0 0 5px 5px; 
} 

.ns_round, a.ns_btn-small, a.ns_btn, a.ns_btn-big, .ns_box, .ns_form button, #ns_box-login, .ns_selector, #ns_top-right .ns_logged-in .ns_bnote, .ns_generic, #ns_nav-sub-wrap, .ns_form input[type="file"], .ns_form input, .ns_form textarea, .ns_form select, .contest_stats, .ns_bubble, .ns_form .ns_radio-btn li, .ns_checkbox-big li, ul.ns_list-box-5 li a, ul.ns_logo-type li, button.ns_btn, ul.ns_list-box-4 li a, .ns_pagination span, .ns_pagination a, .ns_pagination .current.prev, ul.ns_list-box-3 li, table.ns_generic, .ns_code, .ns_tooltip, ul.ns_contest-type li span.ns_icon, .ns_landing-page .ns_contest-panel, .ns_contest-table, .ns_gallery li.ns_entry, ul.ns_milestones li, .ns_contact-pic, ul.ns_skills-bubble li, .ns_designstudio-hiw, .ns_status-box, .ns_level-up, ul.ns_sub-balance, .ns_toggle.ns_expand, .ns_toggle.ns_collapse, .ns_profile-pic, .ns_avg-rating { 
    border-radius: 6px 6px 6px 6px; 
} 
.ns_round-bottom, #ns_nav-main li ul, .ns_fancy-panel, #ns_nav-sub li ul, #ns_nav-sub li ul li.ns_last a:hover, #ns_nav-main li li.ns_last, #ns_nav-main li li.ns_last a:hover, .ns_total, table.ns_generic, .ns_box-half.ns_box-bottom { 
    border-bottom-left-radius: 6px; 
    border-bottom-right-radius: 6px; 
} 
.ns_round-top, .ns_box .ns_top, .ns_login-on, .ns_price-box, #ns_box-country, .ns_box-half.ns_box-top, .ns_avg-rating h2 { 
    border-radius: 6px 6px 0 0; 
} 
.ns_round-top-left, table.ns_contest th:first-child, table.ns_generic th:first-child, .dataTable thead tr th:first-child, .ns_notify.ns_generic .ns_sidebar, .ns_table th:first-child, .ns_gamification-dropdown { 
    border-top-left-radius: 6px; 
} 
.ns_round-top-right, table.ns_contest th:last-child, table.ns_generic th:last-child, .dataTable thead tr th:last-child, .ns_table th:last-child, #ns_nav-sub li.ns_last a:hover { 
    border-top-right-radius: 6px; 
} 
.ns_round-bottom-right, ul.ns_gallery .ns_num, #ns_nav-sub li.ns_last a:hover, .ns_gamification-dropdown { 
    border-bottom-right-radius: 6px; 
} 
.ns_round-bottom-left, .ns_zoom-btn, .ns_notify.ns_generic .ns_sidebar, .ns_gamification-dropdown { 
    border-bottom-left-radius: 6px; 
} 
.ns_round-left, #ns_banner .ns_ebook input, #ns_searchbox { 
    border-radius: 6px 0 0 6px; 
} 
.ns_round-right, #ns_banner .ns_ebook button, .ns_btn.ns_openid .ns_status.ns_selected { 
    border-radius: 0 6px 6px 0; 
} 
.ns_round-3, .ns_form input[type="file"], .ns_form input, .ns_form textarea, .ns_form select, .ns_notify, .ns_contacts.ns_search-box, ul.ns_filter li.ns_current, .ns_close, .ns_rate-bubble { 
    border-radius: 3px 3px 3px 3px; 
} 
ul.ns_sidenav li.selected a:hover { 
    color: #FFFFFF !important; 
} 
ul.ns_sidenav li a { 
    color: #333333; 
    height: 44px; 
    line-height: 40px; 
    padding-left: 20px; 
} 
ul.ns_sidenav li a:hover { 
    color: #008BCB !important; 
    text-decoration: none !important; 
} 
dt, ul { 
    list-style-type: disc; 
    margin: 0; 
    padding: 0; 
} 
ul.list-style-none, ul.list-style-none li { 
    list-style-type: none; 
} 

任意の努力をいただければ幸いです。

ありがとうございました。

Answer 1

私のサイトのテーマの黄色を除いて、実際にはChromeでまったく同じバグが発生することがあります。通常は、要素が表示されたり消えたりすると、通常はカスタムツールチップが表示されます。

私はそれがChromeのレンダリングエンジンのバグであるという結論に達しました。私たちができることは、すぐにそれを修正することです。