在wordpress的下拉菜单

Question

我已经设置了一个wordpress下拉菜单，以便在我创建的主题中工作。当你将鼠标悬停在菜单中所需的父链接上时，它正在工作，但是下拉菜单一直显示在菜单的左侧而不是它应该的下方。要测试它，请转到THIS SITE。

如何让它显示在我想要的下方。将鼠标悬停在“太阳能电力”上观看测试。它出现在Home之下，而不是它应该在哪里。

我正在使用的CSS是：

/* sub menus!!  */

ul.dropdown ul {
    background-color:#383530;
    list-style: none;
    margin:0; /* Appear just below the hovering list */
    padding:0.6em;
    width:200px; /* specify the width. */
    position:absolute; /* needed */
    z-index:500; /* specify the order */
}

ul.dropdown li ul {
    top:27px; /* Positioning:Calc with top level horz list height */
    -moz-box-shadow:0 2px 10px #000; /* CSS 3 */
}

ul.dropdown ul ul {
    top:0;
    left:100%; /* Position the sub menus to right. */
}

ul.dropdown ul li {
    float:none; /* umm.. Appear below the previous one. mmkay? */
}

/* Drop Down! */

/* Hide all the dropdowns (submenus) */
ul.dropdown ul,
ul.dropdown li:hover ul ul,
ul.dropdown ul li:hover ul ul
{ display: none; }

/* Display the submenus only when li are hovered */
ul.dropdown li:hover ul,
ul.dropdown ul li:hover ul ,
ul.dropdown ul li ul li:hover ul
{ display: block;}

ul.dropdown li * a:hover {
    /* Change color of links when hovered */
    background: #600;
    background: -moz-linear-gradient( top, #200, #400); /* CSS 3 */
    border-bottom:1px solid #900;
    border-top:1px solid #222;
}

Answer 1

在其他菜单中单击三张图像时，显示重复的下拉菜单。

这是代码：

  if( $args->walker->has_children && $depth == 0 ) {
              $output .= '<span class="caret down" onclick="myFunction()">';
          }
            $output .= '</span>';
}
function start_lvl( &$output, $depth=0, $args = array() ){
    $submenu = ($depth > 0) ? ' sub-menu' : '';
    $output .= "<ul id='myDropdown' class='dropdown-menu $submenu depth_$depth'>";

}

Answer 2

将display:inline-block而不是display:inline设置为 style.css 中的以下规则第＃206行

#menu li {
  display: inline-block; /* change this */
  list-style: none;
  padding: 0.3em 1em;
}