通過點擊

Question

添加浮動DIV到錶行我有如下表：

在盤旋藍色圖標的點擊，應該在右側打開的「浮動」的div一些項目側。

該div應該是響應式的，並且與該行完全對齊。

我做到了，將浮動div定義爲absolute並使用了固定像素尺寸。

我的問題是，如果我根據行的相對位置對齊浮動div，它會得到父div的overhidden。如果我把它與dom做比較，那麼它就沒有反應。

任何關於我的divs結構應該如何的建議？

如果有任何信息丟失，請讓我知道嗎？

編輯：

下面是該問題的一個JS-小提琴：https://jsfiddle.net/omriman12/3gv788o4/

我想紅squere給行對齊（試行紅色squere移動的右側黑盒子）

Answer 1

試試這個，可能是你要求這個。

.main_wrapper{ 
    width: 79%; 
    position:relative; 
    display: inline-block; 
    overflow: hidden; 
} 

.a1{ 
    width: 100%; 
    height: 50px; 
    background-color: black; 
} 

.a2{ 
    width: 100%; 
    height: 50px; 
    background-color: red; 
    position: fixed; 
    right: 0px; 
    top: 8px; 
} 

.blue-wrapper { 
    width:20%; 
    background-color:blue; 
    display: inline-block; 
    height:50px; 
} 

（或）

.main_wrapper{ 
    width: 100%; 
    position:relative; 
    display: inline-block; 
    overflow: hidden; 
} 

.a1{ 
    width: 100%; 
    height: 50px; 
    background-color: black; 
} 

.a2{ 
    width: 100%; 
    height: 50px; 
    background-color: red; 
    position: absolute; 
    left: 0px; 
    top: 8px; 
    z-index:9; 
} 

.blue-wrapper { 
    width:20%; 
    background-color:blue; 
    display: inline-block; 
    height:50px; 
    position:absolute; 
    top:8px; 
    right:8px; 
    z-index:1; 
}