我在（How can I position an inner tag at different position?）之前询问了一个更基本的问题，并得到了很好的回答。但是我忘了更深的子层次.. 基本的问题是，顶级项目显示在页面上的不同位置比子级别的..如何将内部 - 内部标签放置在不同的位置？

所以结构看起来像现在此：

<div id="menu"> 
    <div class="body-menu"> 
     <ul> 
      <li class="current"><div class="body-menu"> 
       <a href="bla">Item1</a> 
       <ul> 
        <li class="current"><div class="body-menu"> 
         <a href="bla">Item 1.1</a> 
         <ul> 
          <li class=""><div class="body-menu"> 
           <a href="bla">Item 1.1.1</a> 
          </div></li> 
          <li class="current deepest-menu"><div class="body-menu"> 
           <a href="bla">Item 1.1.2</a> 
          </div></li> 
         </ul> 
        </div></li> 
        <li class=""><div class="body-menu"> 
         <a href="bla">Item 1.2</a> 
        </div></li> 
       </ul> 
      </div></li> 
      <li class=""><div class="body-menu"> 
       <a href="bla">Item 2</a> 
      </div></li> 
     </ul> 
    </div> 
    <div class="menu-background"></div> 
</div>

我用这个代码来解决表示在左侧，菜单的子级一和顶层在它们的原始位置（顶菜单）

.body-menu > ul > li { 
position:relative; 
padding-bottom: 1em; 
} 
.body-menu ul ul { 
position:absolute; 
left:10px; 
top:30px; 
}

的基本问题

但现在在1.1级的项目。 1正在显示超过1.1的...

有没有一个简单的解决方案呢？

非常感谢您的帮助！ --crisler

UPDATE

CSS东西 http://jsfiddle.net/crisler/wZrVS/（简单） http://jsfiddle.net/crisler/pMTHX/1/（更多的项目。）有点拥挤，因为大部分是从大学css文件.. 希望我得到的一切

来源

2012-09-17 crisler

你能不能提供此HTML相关的所有CSS，所以我们可以降它到JS小提琴和修补它周围？ –

当然，希望我得到everyting：http://pastebin.com/zH8cdWMn – crisler

我似乎无法获得该链接加载...你可以将其粘贴到jsFiddle或stackoverflow？ http://jsfiddle.net/ –

使用此CSS来代替：

.body-menu ul ul.second-level { 
    position:absolute; 
    left:10px; 
    top:30px; 
}

并将一个second-level类添加到立即嵌套在第一级项目之后的所有ul（即。 项目1，项目2，...）：

<a href="bla">Item1</a> 
    <ul class="second-class">

的问题是，你申请的是CSS规则所有子列表在你的代码。有了这个改变，它只会影响列表的第二层，其余的将会正常运行。

这是结果：

nested lists

这是编辑的小提琴（带有多个项目）：http://jsfiddle.net/pMTHX/2/

来源

2012-09-18 07:19:07 pacha

如何将内部 - 内部标签放置在不同的位置？

UPDATE

回答

相关问题