2016-11-22 41 views
2

我試圖把裏面的李子。如果用戶點擊一個li標籤,div就會出現。列表元素處於水平位置,div內容應放置在整個列表中。目前,如果div出現,則標準內容會出現在div上。裏面李全寬

example

.filter-list { 
 
    position: relative; 
 
} 
 
.filter { 
 
    display: inline-block; 
 
    padding-right: 40px; 
 
} 
 
.subnav { 
 
    position: absolute; 
 
}
<ul class="filter-list"> 
 
    <li class="filter">Name 
 
    <div id="subnav"><a href="#">one</a><a href="#">two</a><a href="#">three</a> 
 
    </div> 
 
    </li> 
 
    <li class="filter">Name two</li> 
 
    <li class="filter">Name three</li> 
 
</ul>

+0

嘗試設置'Z-index'屬性大值 – Gaslan

+0

是'.subnav'選擇只在您的示例錯誤還是在你的代碼中? –

+0

如果'subnav'是絕對定位的,高度將不會被添加到其父項。它被排除在正常流程之外。 –

回答

1

試試這個

<ul class="filter-list"> 
    <li class="filter">Name 
    <div class=row> 
    <div id="subnav"><a href="#">one</a><a href="#">two</a><a href="#">three</a></div> 
    </div> 
    </li> 
    <li class="filter">Name two</li> 
    <li class="filter">Name three</li> 
</ul> 
+0

感謝,什麼風格是類「行」 –

+0

它的一種風格在Bootstrap –

+0

使用的問題是,如果subnav是在名字二,它在第二個李下,但它應該始終對齊孔左側左側。任何解決方案 –