引导，使​​下拉触发

Question

我用引导的下拉列表中有这样的结构：

<div id="navigation" class="row-fluid"> 
    <table class="basic" width="85%" border="0" cellspacing="0" cellpadding="0"> 
    <tr> 
     <td class="current" height="60%" align="center" valign="center"> 
     <a href="<? echo base_url(); ?>">Home</a> 
     </td> 
     <td class="" align="center" valign="center"> 
     <div style="position: relative"> 
      <a id="dropdown1" class="dropdown-toggle" data-toggle="dropdown">About Us</a> 
      <ul class="dropdown-menu dropdown" role="menu" aria-labelledby="dropdown1"> 
      <li><a class="node" tabindex="-1" href="<? echo base_url(); ?>unique/">What makes us unique?</a></li> 
      <li><a class="node" tabindex="-1" href="<? echo base_url(); ?>promise/">Our promise to you</a></li> 
      <li><a class="node" tabindex="-1" href="<? echo base_url(); ?>mission/">Mission and Vision</a></li> 
      <li><a class="node" tabindex="-1" href="<? echo base_url(); ?>customers/">What do our customers say?</a></li> 
      <li><a class="node" tabindex="-1" href="<? echo base_url(); ?>history/">Our History</a> </li> 
      </ul> 
     </div> 
    </tr> 
    </table> 
</div> 

，这是CSS：

#navigation .basic { 
    height: 100%; 
    margin: 0 auto; 
} 

由于我没有设法让TD作为工作触发下拉列表（因为定位），我在里面创建了div和link。

由于表中的对齐，我的链接短于td高度，我怎样才能让td打开下拉菜单而不是使高度达到100％？

将链接高度设置为100％不起作用。

Answer 1

一个小小的CSS应该可以治愈你的病。无需更改触发元素。

http://jsfiddle.net/isherwood/SAwmV/1/

div.dropdown-wrapper { 
    position: relative; 
    height: 100%; 
} 
a.dropdown-toggle { 
    height: 100%; 
    display: block; 
} 

<div class="dropdown-wrapper"> 
    <a id="dropdown1" class="dropdown-toggle" data-toggle="dropdown">About Us</a> 

    <ul> 
    ...