Question

我有一个HTML下拉列表。当我将鼠标悬停在它上面时，它会扩展。我在下拉列表中添加了一个新条目，当我将鼠标悬停在它上面时，我希望我的新条目完全可见（我在下拉列表中添加了 Comp3 。我可以看到它的上半部分，但不是完全< EM>器Comp3 ）。我试过各种各样的事情，比如给div增加高度，增加css中组件的高度，但没有任何帮助。在浏览器中查看该源代码，这是该特定下拉列表的小代码片段：

<div class="optionsDropDown">
  <p class="optionsDropDown collapseTrigger" id="userMenu">
    Hello<em>&nbsp;User </em><span class="closed"></span>
  </p>
  <ul class="optionsDropDown collapseContent closed" name="userMenu">
    <li>
      <a class="optionsDropDown" href="javascript:showHelp();">
        <span id="0">Comp1</span>
      </a>
    </li>
    <li>
      <a class="optionsDropDown" href="myAction.do?actionCode=3&page=controlPanel" target="view">
        <span id="1">Comp3</span>
      </a>
    </li>    
  </ul>
</div>

以下是扩展下拉列表的javascript函数：

$.fn.openMenu = function(menuContent){ 
  $(menuContent).slideDown(200,function() { 
    $(menuContent).children().fadeTo('fast',1); 
  }); 
  $('span', this).removeClass('closed');
};

这是下拉类：

div.optionsDropDown {
    float: right;  
    font-size: 11px;
    height: 25px;
    margin: 12px 32px 0 0;
    position: absolute;
    top: 0px;
    right: 10px;
    width: 120px;
    z-index: 10000;
}

如果高度可以增加，请告诉我。提前谢谢。

Answer 1

我认为您的<div>和<ul>高度需要设置为自动，并且需要调整每个<li>的高度。

在处理这类问题时，CSS经常成为击中或失败的做法。首先将所有内容设置为自动，然后系统地尝试每个排列。

祝你好运！

如何增加我的下拉高度？

1 个答案: