Question

我在Drupal7中使用Superfish菜单，我的第一个项目级别是垂直设计的。现在我想将我的第二个项目水平设置为水平。我怎么能这样做？我尝试了不同的CSS方法，通过jQuery添加了一些类名，如

$（＆＃39;第一级li＆＃39;）找到（＆＃39; ul＆＃39;）。addClass（＆＃39; sf-vertical＆＃39;）;

但没有任何帮助。 TNX！

编辑：here is a jsfiddle，我的菜单看起来像

<ul id="superfish-1" class="sf-menu menu-page-menu sf-vertical sf-style-none sf-total-items-6 sf-parent-items-1 sf-single-items-5 sf-js-enabled">
    <li id="menu-622-1" class="first odd sf-item-1 sf-depth-1 sf-no-children">Item 1</li>
    <li id="menu-623-1" class="middle even sf-item-2 sf-depth-1 sf-total-children-5 sf-parent-children-0 sf-single-children-5 menuparent">Item 2
        <ul class="sf-vertical sf-hidden">
            <li id="menu-633-1" class="first odd sf-item-1 sf-depth-2 sf-no-children" style="white-space: normal; float: left; width: 100%; ">SubItem </li>
            <li id="menu-634-1" class="middle even sf-item-2 sf-depth-2 sf-no-children" style="white-space: normal; float: left; width: 100%; ">SubItem </li>
            <li id="menu-635-1" class="middle odd sf-item-3 sf-depth-2 sf-no-children" style="white-space: normal; float: left; width: 100%; ">SubItem </li>
            <li id="menu-636-1" class="middle even sf-item-4 sf-depth-2 sf-no-children" style="white-space: normal; float: left; width: 100%; ">SubItem </li>
            <li id="menu-637-1" class="last odd sf-item-5 sf-depth-2 sf-no-children" style="white-space: normal; float: left; width: 100%; ">SubItem </li>
        </ul>
    </li>
    <li id="menu-624-1" class="middle odd sf-item-3 sf-depth-1 sf-no-children">Item 3</li>
    <li id="menu-625-1" class="middle even sf-item-4 sf-depth-1 sf-no-children">Item 4</li>
    <li id="menu-626-1" class="middle odd sf-item-5 sf-depth-1 sf-no-children">Item 5</li>
    <li id="menu-627-1" class="last even sf-item-6 sf-depth-1 sf-no-children">Item 6</li>
</ul>

Answer 1

修复.sf-menu ul li ul和.sf-menu ul ul li的修正宽度，移除width:100%并提供margin_right:XXpx;

CSS喜欢

.sf-menu ul li ul{width:400px;}
.sf-menu ul ul li{float:left; margin-right:10px;}

如何使Superfish菜单在第一级垂直但在第二级水平？

1 个答案: