我在（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

回答

相關問題