0
我試圖創建一個下拉菜單，顯示圖像何時懸停。我遇到的問題是，div #topbar需要溢出：隱藏，但顯然，當下拉菜單放在裏面並剪輯在這個頂部欄的底部時會產生問題。下拉菜單顯示的問題
我想知道是否有一種方法來覆蓋這個溢出：隱藏，以便下拉菜單完全顯示？感謝大家。
截圖的問題（國防部PTS）： 
HTML/PHP：
<div id="topbar">
<div id="text-topbar">
<a href="http://www.defensedpt.com/index.html"><img src="images/home.png" /></a><img src="images/spacer.png" />
<a href="http://www.defensedpt.com/personnel/index.html"><img src="images/pts-home.png" /></a><img src="images/spacer.png" />
<a href="http://www.defensedpt.com/personnel/pts.php"><img src="images/main-listing.png" /></a><img src="images/spacer.png" />
<a href="http://www.defensedpt.com/personnel/mc_mos.php"><img src="images/mos-roster.png" /></a><img src="images/spacer.png" />
<a href="http://www.defensedpt.com/personnel/dd.php"><img src="images/fired.png" /></a><img src="images/spacer.png" />
<a href="http://www.defensedpt.com/personnel/hd.php"><img src="images/resigned.png" /></a><img src="images/spacer.png" />
<?php
if (!empty($user_data) && $user_data['moderator'] == 1) {
$menu1 =
'<ul id="menu">
<li><a href="#"><img src="images/mod-pts.png" /></a>
<ul>
<li style="overflow: visible;"><a href="#">The Team</a></li>
<li><a href="#">History</a></li>
<li><a href="#">Vision</a></li>
</ul>
</ul>
';
printf($menu1);
}
if (!empty($user_data) && $user_data['admin'] == 1) {
echo '<a href="http://www.defensedpt.com/personnel/approve.php"><img src="images/approve.png" /></a><img src="images/spacer.png" />';
echo '<a href="http://www.defensedpt.com/personnel/ban.php"><img src="images/ban.png" /></a><img src="images/spacer.png" />';
echo '<a href="http://www.defensedpt.com/personnel/unban.php"><img src="images/unban.png" /></a><img src="images/spacer.png" />';
echo '<a href="http://www.defensedpt.com/personnel/delete_entries.php"><img src="images/delete.png" /></a>';
}
?>
</div>
</div>
CSS：
#topbar {
width: 1980px;
height: 44px;
background: #1C1C1C;
position: fixed;
top: 0px;
left: 0px;
-moz-box-shadow: 1px 1px 10px 1px #000000;
-webkit-box-shadow: 1px 1px 10px 1px #000000;
box-shadow: 1px 1px 10px 1px #000000;
vertical-align: middle;
text-align: left;
overflow: hidden;
z-index: 99;
}
#text-topbar {
position:absolute;
width: 70%;
top:35%;
left:160px;
height:44px;
}
ul {
font-family: open_sanslight;
font-size: 18px;
margin: 0;
padding: 0;
list-style: none;
display: inline-block;
}
ul li {
display: block;
position: relative;
float: left;
}
li ul {
display: none;
}
ul li a {
display: block;
text-decoration: none;
color: #6d6d6d;
background: #1C1C1C;
white-space: nowrap;
font-family: open_sanslight;
margin-left: 5px;
margin-right: 5px;
}
ul li a:hover {
background: #1C1C1C;
color: #6d6d6d;
overflow: visible;
}
li:hover ul {
display: block;
position: absolute;
overflow: visible;
}
li:hover li {
float: none;
font-size: 11px;
overflow: visible;
}
li:hover a {
background: #1C1C1C;
color: #6d6d6d;
overflow: visible; }
li:hover li a:hover {
background: #1C1C1C;
color: #6d6d6d;
overflow: visible;
定位請出示渲染HTML，PHP沒有。爲什麼你的頭文件需要溢出：隱藏？我認爲這是你應該關注的問題。 – isherwood