Question

就像标题所说的那样。

我在<body>中创建了一个css悬停菜单，我总是希望它位于浏览器的右上角。但是当我将鼠标悬停在菜单上时，水平滚动条会显示在浏览器中。

有人知道为什么吗？以及如何解决它？

这是一个带有示例的链接：http://jsfiddle.net/pdbYz/24/

Answer 1

你的脏菜单溢出了...... 试试看：

div#sub_menu div.sub_menu_top {
    width:150px;
}

http://jsfiddle.net/pdbYz/25/

Answer 2

由于子菜单的阴影，你必须以某种方式剪辑它

编辑：因为<div class="sub_menu_top"></div>，您需要将其设置为right:0

Answer 3

div#sub_menu div.sub_menu_top {
    width:250px;
    height:13px;
    background-image:url(../images/arrow_up.png);
    background-repeat:no-repeat;
    background-position:109px bottom;
    position:absolute;
    top:-13px;
}

删除position:absolute;，滚动条消失。

Answer 4

在http://jsfiddle.net/pdbYz/24/上的HMTL代码中，如果更改了行

<div class="drop_down_block" id="sub_menu">

到

<div class="drop_down_block" id="sub_menu" style="position:fixed; right:0px;">

当您将鼠标悬停在菜单上时，滚动条不会显示。

你仍然需要弄清楚在CSS文件中添加CSS的位置，但我想你可以很容易地做到这一点。如果没有，请告诉我，我会尝试添加更多信息。

当我悬停css菜单时出现水平滚动条

4 个答案: