我的3个下拉菜单在此网站上正常运行，这意味着它们显示在菜单http://readautism.atwebpages.com下面的图片顶部 当我在Webview中转换为Android应用时，菜单会在图像下方而不是在顶部。有任何解决这个问题的方法吗。 这是与下拉菜单相关的html代码。如果需要其他代码，请告诉我。非常感谢!!
<body>
<nav class="navbar navbar-default" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Filter</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<div class="btn-group">
<div class="btn-group">
<button type="button" class="btn navbar-btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown">
<span class="text-muted">Type</span>
<strong class="selection">All</strong>
<span class="caret"></span>
</button>
<ul class="dropdown-menu js-select-menu js-filter">
<li class="active"><a href="#" data-filter="all">All</a></li>
<li><a href="#" data-filter=".type-sports">Sports</a></li>
<li><a href="#" data-filter=".type-food">Food</a></li>
<li><a href="#" data-filter=".type-home">Home</a></li>
<li><a href="#" data-filter=".type-clothing">Clothing</a></li>
<li><a href="#" data-filter=".type-vehicle">Vehicle</a></li>
<li><a href="#" data-filter=".type-animal">Animal</a></li>
<li><a href="#" data-filter=".type-body">Body</a></li>
<li><a href="#" data-filter=".type-various">Various</a></li>
</ul>
</div>
</div>
<div class="btn-group">
<button type="button" class="btn navbar-btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown">
<span class="text-muted">Letter</span>
<strong class="selection">All</strong>
<span class="caret"></span>
</button>
<ul class="dropdown-menu js-select-menu js-filter">
<li class="active"><a href="#" data-filter="all">All</a></li>
<li><a href="#" data-filter=".letter-a">A</a></li>
<li><a href="#" data-filter=".letter-b">B</a></li>
<li><a href="#" data-filter=".letter-c">C</a></li>
<li><a href="#" data-filter=".letter-d">D</a></li>
<li><a href="#" data-filter=".letter-e">E</a></li>
<li><a href="#" data-filter=".letter-f">F</a></li>
<li><a href="#" data-filter=".letter-g">G</a></li>
<li><a href="#" data-filter=".letter-h">H</a></li>
<li><a href="#" data-filter=".letter-i">I</a></li>
<li><a href="#" data-filter=".letter-j">J</a></li>
<li><a href="#" data-filter=".letter-k">K</a></li>
<li><a href="#" data-filter=".letter-l">L</a></li>
<li><a href="#" data-filter=".letter-m">M</a></li>
<li><a href="#" data-filter=".letter-n">N</a></li>
<li><a href="#" data-filter=".letter-o">O</a></li>
<li><a href="#" data-filter=".letter-p">P</a></li>
<li><a href="#" data-filter=".letter-q">Q</a></li>
<li><a href="#" data-filter=".letter-r">R</a></li>
<li><a href="#" data-filter=".letter-s">S</a></li>
<li><a href="#" data-filter=".letter-t">T</a></li>
<li><a href="#" data-filter=".letter-u">U</a></li>
<li><a href="#" data-filter=".letter-v">V</a></li>
<li><a href="#" data-filter=".letter-w">W</a></li>
<li><a href="#" data-filter=".letter-x">X</a></li>
<li><a href="#" data-filter=".letter-y">Y</a></li>
<li><a href="#" data-filter=".letter-z">Z</a></li>
</ul>
</div>
<div class="btn-group">
<button type="button" class="btn navbar-btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown">
<span class="text-muted">Number</span>
<strong class="selection">All</strong>
<span class="caret"></span>
</button>
<ul class="dropdown-menu js-select-menu js-filter">
<li class="active"><a href="#" data-filter="all">All</a></li>
<li><a href="#" data-filter=".number-2">2</a></li>
<li><a href="#" data-filter=".number-3">3</a></li>
<li><a href="#" data-filter=".number-4">4</a></li>
<li><a href="#" data-filter=".number-5">5</a></li>
<li><a href="#" data-filter=".number-6">6</a></li>
<li><a href="#" data-filter=".number-7">7</a></li>
<li><a href="#" data-filter=".number-8">>8</a></li>
</ul>
</div>
<div class="btn-group">
<a class="navbar-brand" href="#">Sort</a>
<button type="button" class="btn navbar-btn btn-xs btn-default dropdown-toggle" data-toggle="dropdown">
<span class="text-muted">Sort</span>
<strong class="selection">Name</strong>
<span class="caret"></span>
</button>
<ul class="dropdown-menu js-select-menu js-sort">
<li><a href="#" data-sort="name">Name</a></li>
<li><a href="#" data-sort="letters">Letters</a></li>
<li><a href="#" data-sort="activity">Activity</a></li>
</ul>
</div>
<ul class="nav navbar-nav navbar-right stats js-filter" data-filter-group="medium">
<li>
<a href="#" data-filter=".medium-service">
<strong class="stat-count">0</strong>
<span class="stat-type">Words</span>
</a>
</li>
<li>
<a href="#" data-filter=".medium-post">
<strong class="stat-count">0</strong>
<span class="stat-type">Articles</span>
</a>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<center>
<div class="container">
<div class="isotope row">
<?php
$conn=new mysqli("fdb13.awardspace.net","1778576_vibajajo","vincer64","1778576_vibajajo") or die ('cannot open database');
$sql='SELECT Criteria, Images, name, letters, activity FROM Persons LIMIT 100';
$result = $conn->query($sql) or die (mysqli_error($conn));
while ($row = $result->fetch_assoc()) {
$Criteria = $row['Criteria'];
$Images = $row['Images'];
$name =$row['name'];
$letters =$row['letters'];
$activity =$row['activity'];
echo "<div class=$Criteria>";
echo "<img class=$Images>";
echo "<h3 class='name'>$name</h3>";
echo "<span class='letters'>$letters<span>";
echo "<span class='activity'>$activity<span></div>";
};
?>
</div>
</div></center>
</body>
CSS
.dropdown-menu {
position: absolute;
top: 100%;
left: 0;
z-index: 1000;
display: none;
float: left;
min-width: 160px;
padding: 5px 0;
margin: 2px 0 0;
font-size: 14px;
list-style: none;
background-color: #fff;
background-clip: padding-box;
border: 1px solid #ccc;
border: 1px solid rgba(0, 0, 0, .15);
border-radius: 4px;
-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}
答案 0 :(得分：0)
您的问题是，在移动导航下拉列表中，您已将高度设置为高度：自动。把它改成一个固定的高度，我设置＆＃34;身高：500px＆＃34;它工作正常！我会解释为什么会发生这种情况，但我不明白为什么会这样做......也许，因为下拉高度不是某种导航的孩子。
修改：
您还可以添加＆＃34; overflow-y：scroll;＆＃34;到nav元素并保持＆＃34; height：auto;＆＃34;。