溢出溢出：隱藏的容器不改變HTML結構

Question

我有一個父元素溢出：隱藏和兩個重疊的孩子。我想要一個孩子聽溢出：隱藏，一個人藐視它。現在，兩個孩子都聽溢出：隱藏。我想藐視溢出隱藏！

<div class="ihave-overflow-hidden"> 
    <div class="i-will-not-overflow">Some text</div> 
    <div class="but-i-will-overflow">I'm a Popover and popovers should always overflow</div> 
</div> 

我想要類「but-i-will-overflow」溢出父類「ihave-overflow-hidden」。

注：這個網站設置卡恩 不幸的是，我不能在這裏更改HTML結構，所以我必須使用純CSS這些類（：&之後：之前是不允許的）

Answer 1

試試這個https://jsfiddle.net/2Lzo9vfc/42/

CSS

.ihave-overflow-hidden { 
    height: 100px; 
    overflow: hidden; 
} 

.i-will-not-overflow { 
    display: inline-block; 
    float: left; 
    width: 50%; 
} 

.but-i-will-overflow { 
    display: inline-block; 
    width: 50%; 
    position: absolute; 
} 

Answer 2

像這樣的事情會得到一個結果你正在尋找：

.ihave-overflow-hidden{ 
    overflow: hidden; 
    height: 15px; 
    width: 30px; 
} 
.i-will-not-overflow{ 
    position: inline; 
} 
.but-i-will-overflow{ 
    position: absolute; 
} 

通過使第二個溢出忽略父母溢出。