CSS样式下拉菜单/右子菜单

Question

我想用HTML/CSS制作下拉菜单。其实，这是问题的菜单。将鼠标悬停在导航栏项目上会触发某些项目上的下拉菜单，然后将鼠标悬停在此子菜单上的项目上方，则会显示另一个子菜单，位于该项目的右侧（dropright菜单）。它应该继续显示项目子菜单，因为我将鼠标悬停在具有子项目的项目上。

这是显示dropright菜单（错误）代码：

#droprightMenu { 
    display: none; /* hide the sub menus */ 
    background: #5f6975; 
    border-radius: 0px; 
    padding: 0; 
    position: absolute; 
    top: 100%; 
} 

#droprightMenu li { 
    float: none; 
    border-top: 1px solid #6b727c; 
    border-bottom: 1px solid #575f6a; 
    position: relative; 

} 

#droprightMenu li a { 
    color: #fff; 
} 

#droprightMenu li a:hover { 
    background: #4b545f; 
} 

这里是我现在有： http://jsfiddle.net/vvozar/yL7su/

现在，你可以将鼠标悬停在项目“分类”时看到，然后在其子项目“全部”上，我正在下拉菜单，我不想要。我希望该菜单显示在该项目的右侧。我想用“id”来表示样式，因为我将动态地（在一个循环中）创建这个子菜单（无序的html列表），并且我不知道它会有多深。 感谢任何帮助。

Answer 1

你需要这个：

#droprightMenu li ul { 
    left:120px; 
    top:0px; 
} 

见：http://jsfiddle.net/JL4JY/