2014-09-19 105 views
0

我有一些下拉的问题。我希望它落在左侧,但我不知道该怎么做。我已经尝试了一些保证金 - 正确和填充的东西,但我找不到解决它的方法。代码是在这里:单下拉菜单,下降到右

ul { 
 
\t list-style: none; 
 
\t padding: 0px; 
 
\t margin: 0px; 
 
} 
 

 
ul li { 
 
\t display: block; 
 
\t position: relative; 
 
\t float: right; 
 
} 
 

 
li ul { 
 
\t display: none; 
 
\t margin-top: -11px; 
 
} 
 

 
ul li a { 
 
\t display: block; 
 
\t padding: 5px 10px 5px 10px; 
 
\t text-decoration: none; 
 
\t color: #f00; 
 
} 
 

 
li:hover ul { 
 
display: block; 
 
position: absolute; 
 
right: 0px; 
 
} 
 

 

 
li:hover li { 
 
\t float: left; 
 
\t margin-left: 10px; 
 
} 
 

 
li:hover a { 
 
\t background: transparent; 
 
\t margin-left: 10px; 
 
} 
 

 
li:hover li a:hover { 
 
\t background: #000; 
 
} 
 

 
#drop-nav li ul li { 
 
\t border-top: 0px; 
 
\t margin-right: 40px; 
 
\t background-color: #FFFFFF; 
 
\t width: 260px; 
 
} 
 

 
img.menu { 
 
height: 39px; 
 
width: 34px; 
 
margin-top: 41px; 
 
}
<ul id="drop-nav"> 
 

 
    <li><a href="#"><img src="https://cdn4.iconfinder.com/data/icons/wirecons-free-vector-icons/32/menu-alt-256.png" class="menu"></a> 
 
    <ul> 
 
     <li><a href="#">General Inquiries</a></li> 
 
     <li><a href="#">Ask me a Question</a></li> 
 
    </ul> 
 
    </li> 
 
</ul>

+0

哪左侧在哪里可以更详细? – 2014-09-19 09:11:52

回答

0
li:hover ul { 
    display: block; 
    position: absolute; 
    right:0px; 
} 
+1

使用权:100%会更明智地避免子菜单与父级重叠。 – Manuszep 2014-09-19 09:23:45

+0

好的问题子菜单不问,我从来没有用左测试:100%,所以我不知道它。所以我会尽力在未来谢谢 – himanshu 2014-09-19 09:26:53