eminem.encore
یک شنبه 10 شهریور 1392, 00:20 صبح
دوستان یه کمک حیاتی واسم بکنین. کلافم کرده
یه منوی آبشاری دارم با مشخصه های زیر
div.menu{
float:right;
font-size:12px;
}
div.menu ul ul {
display: none;
}
div.menu ul li:hover > ul {
display: block;
}
div.menu ul {
background: #efefef;
background: linear-gradient(top, #efefef 0%, #bbbbbb 100%);
background: -moz-linear-gradient(top, #efefef 0%, #bbbbbb 100%);
background: -webkit-linear-gradient(top, #efefef 0%,#bbbbbb 100%);
box-shadow: 0px 0px 9px rgba(0,0,0,0.15);
padding: 0 20px;
border-radius: 10px;
list-style: none;
position: relative;
display: inline-table;
}
div.menu ul:after {
content: ""; clear: both; display: block;
}
div.menu ul li {
float: right;
}
div.menu ul li:hover {
background: #4b545f;
background: linear-gradient(top, #4f5964 0%, #5f6975 40%);
background: -moz-linear-gradient(top, #4f5964 0%, #5f6975 40%);
background: -webkit-linear-gradient(top, #4f5964 0%,#5f6975 40%);
}
div.menu ul li:hover a {
color: #fff;
}
div.menu ul li a {
display: block; padding: 25px 40px;
color: #757575; text-decoration: none;
}
div.menu ul ul {
background: #5f6975; border-radius: 0px; padding: 0;
position: absolute; top: 100%;
}
div.menu ul ul li {
float: none;
border-top: 1px solid #6b727c;
border-bottom: 1px solid #575f6a;
position: relative;
}
div.menu ul ul li a {
padding: 15px 40px;
color: #fff;
}
div.menu ul ul li a:hover {
background: #4b545f;
}
div.menu ul ul ul {
position: absolute; left: 100%; top:0;
}
div.menu ul ul ul li a{
width:60px;
}
پایین این هم یه div دارم واسه محتوای سایت
<div id="main">
</div>
#main{
width:969px;
margin:0 auto;
}
منوی آبشاریم هم به این صورت هست
<div class="menu">
<ul>
<li><a href="#">صفحه خانگی</a></li>
<li><a href="#">منو</a>
<ul>
<li><a href="#">زیر منو 1</a></li>
<li><a href="#">زیر منوی 1</a></li>
<li><a href="#">زیر منوی 1</a>
<ul>
<li><a href="#">زیرمنوی 2</a></li>
<li><a href="#">زیرمنوی 2</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
حالا وقتی این منو رو بدون محتوای زیرین اجرا می کنم منظور از محتوای زیرین div ای هست که آیدیش main هست مشکلی پیش نمیاد اما وقتی این div اضافه میشه دیگه محتوای ul ul یا ul ul ul به نمایش در نمیاد.
از اساتید لطفاً راهنماییم کنین
یه منوی آبشاری دارم با مشخصه های زیر
div.menu{
float:right;
font-size:12px;
}
div.menu ul ul {
display: none;
}
div.menu ul li:hover > ul {
display: block;
}
div.menu ul {
background: #efefef;
background: linear-gradient(top, #efefef 0%, #bbbbbb 100%);
background: -moz-linear-gradient(top, #efefef 0%, #bbbbbb 100%);
background: -webkit-linear-gradient(top, #efefef 0%,#bbbbbb 100%);
box-shadow: 0px 0px 9px rgba(0,0,0,0.15);
padding: 0 20px;
border-radius: 10px;
list-style: none;
position: relative;
display: inline-table;
}
div.menu ul:after {
content: ""; clear: both; display: block;
}
div.menu ul li {
float: right;
}
div.menu ul li:hover {
background: #4b545f;
background: linear-gradient(top, #4f5964 0%, #5f6975 40%);
background: -moz-linear-gradient(top, #4f5964 0%, #5f6975 40%);
background: -webkit-linear-gradient(top, #4f5964 0%,#5f6975 40%);
}
div.menu ul li:hover a {
color: #fff;
}
div.menu ul li a {
display: block; padding: 25px 40px;
color: #757575; text-decoration: none;
}
div.menu ul ul {
background: #5f6975; border-radius: 0px; padding: 0;
position: absolute; top: 100%;
}
div.menu ul ul li {
float: none;
border-top: 1px solid #6b727c;
border-bottom: 1px solid #575f6a;
position: relative;
}
div.menu ul ul li a {
padding: 15px 40px;
color: #fff;
}
div.menu ul ul li a:hover {
background: #4b545f;
}
div.menu ul ul ul {
position: absolute; left: 100%; top:0;
}
div.menu ul ul ul li a{
width:60px;
}
پایین این هم یه div دارم واسه محتوای سایت
<div id="main">
</div>
#main{
width:969px;
margin:0 auto;
}
منوی آبشاریم هم به این صورت هست
<div class="menu">
<ul>
<li><a href="#">صفحه خانگی</a></li>
<li><a href="#">منو</a>
<ul>
<li><a href="#">زیر منو 1</a></li>
<li><a href="#">زیر منوی 1</a></li>
<li><a href="#">زیر منوی 1</a>
<ul>
<li><a href="#">زیرمنوی 2</a></li>
<li><a href="#">زیرمنوی 2</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
حالا وقتی این منو رو بدون محتوای زیرین اجرا می کنم منظور از محتوای زیرین div ای هست که آیدیش main هست مشکلی پیش نمیاد اما وقتی این div اضافه میشه دیگه محتوای ul ul یا ul ul ul به نمایش در نمیاد.
از اساتید لطفاً راهنماییم کنین