0
私はdivでWebページを持っていますが、このdivには画像が含まれています。また、私はメニューバーを持っています。イメージはメニューバーの下にあり、拡大されたメニューが上にある間は表示されません。しかし、それはしません：画像が明らかにメニューの上にある。どのように私はこれを修正し、イメージを消すことができますか？ CSSで何か問題はありましたか？メニュー項目の後ろに画像でdivを消すには？
body {
padding-right: 0;
margin-right: 0;
padding-left: 0;
margin-left: 0;
margin-top: 0;
}
.nav {
background-color: #F6F8FB;
position: relative;
display: inline-block;
width: 100%;
height: 80px;
/*overflow: hidden;*/
}
.nav li {
float: left;
padding: 1%;
font-family: AlegreyaSansSC-Light;
font-size: 14px;
color: #637F92;
letter-spacing: 0.52px;
height: 100%;
width: 126px;
margin-top: 0;
margin-left: 0;
margin-right: 0;
margin-bottom: 0;
}
.nav li:hover {
/*background-color: #0B619B;*/
/*opacity: 0.1;*/
/*color: #637F92;*/
background: rgb(221, 232, 241);
/* Fallback for older browsers without RGBA-support */
background: rgba(221, 232, 241, 0.95);
}
.nav ul {
list-style: none;
/*removes bullet points*/
}
.dropdown-content {
display: none;
position: absolute;
background-color: #F6F8FB;
min-width: 70px;
/*box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
padding: 70px 126px;
opacity: 1;
}
.dropdown-content:hover {
background: rgb(221, 232, 241);
/* Fallback for older browsers without RGBA-support */
background: rgba(221, 232, 241, 0.95);
}
.nav li:hover .dropdown-content {
display: block;
}
.logo-bar {
background-color: white;
height: 180px;
width: 100%;
}
.logo {
height: 63px;
width: 56px;
position: relative;
top: 25%;
left: 15%;
/*border: 3px solid #73AD21;*/
}<div class="nav">
<ul>
<li>Wilkommen</li>
<li>Angebot
<ul class="dropdown-content">
<li>Test</li>
<li>Test</li>
</ul>
</li>
<li>Unternehmen
<ul class="dropdown-content">
<li>Hallo</li>
<li>Hallo2</li>
</ul>
</li>
<li>Anfahrt</li>
<li>Kontakt</li>
</ul>
</div>
<!-- LOGO BAR -->
<div class="logo-bar">
<div class="logo">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 63 56" style="enable-background:new 0 0 63 56;" xml:space="preserve">
<style type="text/css">
.st0 {
fill: #0D629C;
stroke: #FFFFFF;
stroke-width: 0.3177;
stroke-miterlimit: 10;
}
.st1 {
fill: #F2DE20;
}
</style>
<g id="XMLID_3_">
<path id="XMLID_13_" class="st0" d="M29.6,44.8c5,3.6,7.4,8.8,0.9,9.9c-8.8,1.5-20.3-2.7-26.1-9.5c-4.3-5,1.2-7.4,7.5-6.9
\t \t \t \t \t C18.3,38.8,24.6,41.2,29.6,44.8z" />
</g>
</svg>
</div>
</div>
それは誰も前にこのような状況に関係あなたが持っている私たちは、HTML、CSSなどの必要最小限の情報を、必要とするいくつかのコード（HTML、CSS、など） –
、および任意のJavascriptを提供してくださいすることができますあなたに特定の答えを与えてください。私が言うことの基本は、メニューのZ-インデックスをより高くする必要があるということです。 – Jhecht
私はファイルの関連部分を追加しました –