2016-05-25 12 views
0

はフィドルドロップダウンが表示されないのはなぜですか?あなたが見ることができるようにここで

https://jsfiddle.net/r2zmxzzd/

で、トップメニュー「同窓会」のドロップダウンが機能していますが、「UETについて」、すなわち下のメニューのドロップダウンが機能していません。

私は2時間以上コードを見つめていましたが、まだそのドロップダウンを表示することはできません。私は要素を調べてみました。ドロップダウンはDOM内にアクティブとして表示されますが、表示されません。下のドロップダウンが表示されない理由はここに

ドロップダウン

<ul class="nav navbar-nav navbar-right"> 
    <li class="dropdown primaryNavItem"> 
     <a href="#" class="primaryNavLink dropdown-toggle" data-toggle="dropdown">About UET <span class="caret"></span></a> 
     <ul class="dropdown-menu"> 
      <li><a href="#" class="primaryNavDropDownLink">Historic Profile</a></li> 
      <li><a href="#" class="primaryNavDropDownLink">Vision &amp; Mission</a></li> 
      <li><a href="#" class="primaryNavDropDownLink">Development Projects</a></li> 
      <li><a href="#" class="primaryNavDropDownLink">Core Team Members</a></li> 
      <li><a href="#" class="primaryNavDropDownLink">UET Progress Report 2015</a></li> 
      <li><a href="#" class="primaryNavDropDownLink">Student Teacher Ratio</a></li> 
      <li><a href="#" class="primaryNavDropDownLink">Information</a></li> 
      <li><a href="#" class="primaryNavDropDownLink">Faculty Statistics</a></li> 
      <li><a href="#" class="primaryNavDropDownLink">FAQs</a></li> 
      <li><a href="#" class="primaryNavDropDownLink">Budget</a></li> 
      <li><a href="#" class="primaryNavDropDownLink">External Linkages</a></li> 
      <li><a href="#" class="primaryNavDropDownLink">International Funding</a></li> 
      <li><a href="#" class="primaryNavDropDownLink">Spin off companies</a></li> 
      <li><a href="#" class="primaryNavDropDownLink">Progress Profile</a></li> 
      <li><a href="#" class="primaryNavDropDownLink">Site map</a></li> 
      <li><a href="#" class="primaryNavDropDownLink">Contacts List</a></li> 
     </ul> 
    </li> 
</ul> 

のコードで誰も私に教えていただけますか?

ありがとうございます。

+0

をCSSを変更する必要があり、私はちょうどブートストラップウェブサイト上で利用可能なコードを取ると言うでしょうあなたのカスタム要素を1つずつ追加し、どこが失敗するかを確認してください。 –

+0

私はカスタムCSSをすべて削除しようとしましたが、それでもドロップダウンの下限では機能しません。 – asamolion

答えて

3

のスタイル:

<a href="#" class="primaryNavLink dropdown-toggle" data-toggle="dropdown">About UET <span class="caret"></span></a> 

はする必要がありますドロップダウン遅れている。オーバーフローを削除します。

1

タグを使用しているためです:

<button type="button" class="primaryNavLink dropdown-toggle" data-toggle="dropdown">About UET <span class="caret"></span></button> 

そして、あなたはこの

header { 
    overflow: hidden; 
    height: 135px; 
} 

を持っているような適切な

+0

岡、ボタンは取引の一部に過ぎませんでした。本当の問題は、オーバーフローが隠されていたことです。 – asamolion

3

隠されたあなたが使用する必要があります:

header { 
overflow: visible;} 
3

あなた<header>overflow: hidden CSSプロパティを持っています。そのため、ドロップダウンが見えなくなります。

あなたのヘッダからoverflow: hiddenを削除します。https://jsfiddle.net/r2zmxzzd/1/

3

こんにちは、あなたのドロップダウンが正常に動作していますが、headerseeスクリーンショットにenter image description here

おかげ

関連する問題