在IE9中将鼠标悬停在内容上时，下拉菜单消失

Question

我正在尝试创建一个带有社交共享链接的下拉菜单，如Facebook，Twitter等。

我正在使用计数按钮，并将它们放在CSS下拉菜单中。只要我将鼠标悬停在下拉菜单的背景上就可以了。当我将鼠标悬停在其中一个社交媒体按钮上的那一刻，当我在IE9中查看它时，整个下拉菜单就会消失。其他所有浏览器都可以正常工作。我不知道如何保持下拉列表显示，以便他们可以喜欢该页面。

我正在使用带有：hover的下拉列表来显示下拉列表。如何让它在EI9中工作？

.HTML

<div id="wrapper_menu"><!-- BEGIN MENU WRAPPER -->    
   <ul class="menu menu_black"><!-- BEGIN MENU -->        
        <li>Share this Page<!-- Begin Home Item -->                        
            <div class="dropdown_2columns"><!-- Begin 2 columns container -->                          
                <div class="col_2 firstcolumn">
                    <div class="col_left">
                        <g:plusone size="tall"></g:plusone>
                    </div>
                    <div class="col_right">
                        <div class="fb-like" data-send="false" data-layout="box_count" data-width="55" data-show-faces="true">
                    </div>                                   
                </div>                
            </div><!-- End 2 columns container -->
        </li><!-- End Home Item -->
    </ul><!-- END MENU -->
</div><!-- END MENU WRAPPER --> 

使用的云服务器

#wrapper_menu {width: 100%; margin:0 auto; display:block; position: relative; z-index:9999;}
#wrapper_menu .menu {list-style:none; width:100%; height:45px;} 
.menu li {float:left; text-align:center; position:relative; margin-right:20px; margin-top:6px; border:none; height: 30px;}
.menu li:hover {}
/*  _______________________________________
    02 DROP DOWN MENU
    _____________________________________  */

/* Left & right aligned common styles */  
.menu .dropdown_2columns,   
.menu .dropdown_fullwidth {
    margin: 2px; 
    left:-999em; 
    position:absolute; 
    background:#161616; 
    border: 2px solid #cdccc3; 
    padding: 10px; 
    text-align:left; 
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        -khtml-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
    background:rgba(255,255,255, 0.8);
} 
/* Drop Downs Sizes */
.menu .dropdown_2columns {width: 160px;}
/* Showing Drop Down on Mouse Hover - Left aligned */
.menu li:hover .dropdown_2columns {left:-7px; top:25px;}
/* Columns Sizes */
.menu .col_2 {width:155px; display:inline; float: left; position: relative; margin-left: 10px;}
.col_left {float: left; width: 49%;}
.col_right {float: right; width: 49%;}
/* IMPORTANT use the firstcolumn class for the items that stick to the left edge of the dropdown */
.menu .firstcolumn {
    margin-left: 0; /* Clearing margin & left */
    clear: left;
}

Answer 1

我遇到了同样的问题，并通过更改下拉列表的高度来解决它，这样它就不会下降到浏览器窗口的底部。不过不能相信，我很棒的同事（又名代码天才）想通了这一点。