Question

在我的网站上MInGamez.com我有一行名为产品的文字，我稍后会将其更改为菜单，但由于我需要，因此我遇到了问题那个和下拉菜单必须是右边的预定义35px;那么我怎样才能将我的下拉线对齐到右边？

因为我必须使用js小提琴添加代码，我将在下面发布我的HTML，

HTML

<!--start menu -->
<div id='cssmenu'>
<ul>
<!-- site logo -->
    <li class='active'><a href='index.html'><span><img style="height: 35px;width:75;" src="images/logo_image.png" alt="website logo"/></span></a>
    </li>
<!-- end site logo -->
<!-- search form -->
        <li class="active"><span>
<div>
<form id="searchform">
    <div>
    <input type="text" size="30" value="" id="inputString" onkeyup="lookup(this.value);" />
    </div>
    <div id="suggestions"></div>
</form>
</div>
    </span>
        </li>
<!-- end search -->
<!-- drop down -->
    <li class='has-sub'><a href='#' style="align:right;"><span>Products</span></a>

        <ul>
            <li class='has-sub'><a href='#'><span>Product 1</span></a>

                <ul>
                    <li><a href='#'><span>Sub Item</span></a>
                    </li>
                    <li class='last'><a href='#'><span>Sub Item</span></a>
                    </li>
                </ul>
            </li>
            <li class='has-sub'><a href='#'><span>Product 2</span></a>

                <ul>
                    <li><a href='#'><span>Sub Item</span></a>
                    </li>
                    <li class='last'><a href='#'><span>Sub Item</span></a>
                    </li>
                </ul>
            </li>
        </ul>
<!-- end drop down -->
</ul>
</div>
<!-- end menu -->

Answer 1

类似于this？

我添加了：

#cssmenu ul ul > li:hover > ul {
    left: 190px !important;
}

Answer 2

为什么你不能简单地给出最外面的position: relative;，然后给出菜单position: absolute; right: 35px;或其他什么。这将确保菜单保持漂浮，正确对齐，在最外面的div的受限边界内。

将菜单下拉菜单置于右侧

2 个答案: