不同的溢出行为

Question

我有什么：

http://jsfiddle.net/GC8D3/

<div class="modal-body" > 
    <div style="background:red; width: 100px; height: 200px;"> 
     A 
     <div style="background:green; width: 50px; height: 150px;"> 
      B 
     </div> 
    </div>    
</div> 

目前双方的div“A”和模态窗口之外“B”溢出。

我想的是，

• 溢出DIV的 “A” 应该被外模态隐藏。
• div“B”溢出应该在模态外可见。

我不能更改div A的大小，因为在实际情况下，我们在画布上移动div“A”。

当我将它移动到边缘附近时，应该隐藏它的溢出。但是“B”的溢出不应该。

Answer 1

这是不可能的。 CSS溢出属性总是影响所有子元素。所以：

1. 上modal-body宣布溢出将隐藏两个孩子的div A和​​B.
2. 宣布对格A溢出将隐藏的div B.一个仍然可以溢出。
3. 如果在1.或2中声明溢出，则无法使div B溢出模式或A。

Answer 2

对于当前的HTML规范，这是不可能的。任何具有隐藏溢出的元素都可以防止其任何子元素出现在其边界之外。

Answer 3

Div B当前是div A的子项。如果div A设置为overflow：hidden，则隐藏从div A溢出的所有内容。因此，如果div B溢出，则无法看到，因为它位于div内A和A不能被溢出。