Question

当母项扩展为适合其子项时，我真的想停止跳转on this site的菜单项。

我可以在添加此CSS时查看我想要的内容，强制菜单项具有固定的宽度：

/*Menu item 1*/
#menu-item-117 .sub-menu {right: -125px;}
/*Menu item 2*/
#menu-item-73 {width:45px;}
#menu-item-73 .sub-menu {width:980px!important;right: -10px;}
/*Menu item 3*/
#menu-item-122 {width:65px;}
#menu-item-122 .sub-menu{width:980px!important;right: 165px;}

然而，这显然不太理想，因为菜单需要是动态的......

有没有办法通过CSS实现我想要的东西？我希望如此！

我正在使用Theme Hybrid附带的Superfish菜单进行Wordpress。

提前感谢您提供的任何帮助！

Answer 1

我明白了......让我们再看一遍。

此版本使用position: relative/absolute;代替float: right/left;，并且下面有一个缺陷。

但是我没有在旧的浏览器中测试这个，包括IE（在Chrome和Firefox中测试过），但我希望这可以为您提供一些实现它的想法。：）

#primary-menu .menu /* new rule */ {
  position: relative;
  height: 50px; /* The flaw is you have to fix the menu's height here */
}

#primary-menu ul {
    position: absolute;
    right: 0;
    top: 0;
}

#primary-menu li {
    float: left;
    list-style: none outside none;
    margin-left: 10px;
    position: relative;
}

.sub-menu {
    background: none repeat scroll 0 0 #244563;
    clear: both;
    display: none;
    font-size: 0.8em;
    overflow: visible;
    padding: 5px 0 !important;
    position: relative;
    right: 0;
    text-align: right;
    top: 30px !important;
    width: 700px !important;
}

.sub-menu li {
    display: inline !important;
    float: none !important;
    padding: 10px 0 !important;
    width: auto !important;
}

右对齐Superfish菜单 - 并阻止它跳跃

1 个答案: