Twitter の Bootstrap を使用して Web サイトを設計していますが、応答性の高いナビゲーション バーに問題があります。ブートストラップでは、ナビゲーション バーにより、モバイル ユーザーはアイコンをクリックしてナビゲーション バーを拡張し、ナビゲーション リンクを表示できます。最大の高さを調整する方法が見つかりません...ドロップダウンバーのいずれかを使用しようとすると、それに応じてナビゲーションバーのサイズが変更されず、ユーザーはリンクを表示できません。
ご協力いただきありがとうございます。
-A
編集:これは、ナビゲーションバー(html)に使用しているコードです。使用しているcssは、標準のbootstrap.cssおよびbootrstrap-responsive.cssです:
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="brand" href="http://example.com">organization</a>
<div class="nav-collapse collapse">
<ul class="nav">
<li><a href="index.html">Home</a></li>
<li class="active"><a href="contact.html">Contact</a></li>
<li><a href="nowplaying.html">Now Playing</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Public Resources <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="public.html#observatory">Observatory</a></li>
<li><a href="public.html#planetarium">Planetarium</a></li>
<li class="divider"></li>
<li class="nav-header">For Teachers and Schools</li>
<li><a href="schools.html#programs">Programs</a></li>
<li><a href="schools.html#events">Host an Event</a></li>
<li><a href="schools.html#education">Educational Initiatives</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Undergraduate Resources <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="students.html#observatory">Observatory</a></li>
<li><a href="students.html#planetarium">Planetarium</a></li>
<li class="divider"></li>
<li class="nav-header">Physics</li>
<li><a href="xxx.com">Physics Homepage</a></li>
<li><a href="xxx.com">Physics and Astronomy</a></li>
</ul>
</li>
<li><a href="volunteer.html">Volunteer</a></li>
<li><a href="faq.html">FAQ</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
</div>