css - 同一容器中 div 的不同溢出行为

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”在 Canvas 上移动。

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

Answer 1

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

1. 在 modal-body 上声明溢出将隐藏子 div A 和 B。
2. 在 div A 上声明溢出将隐藏 div B。A 仍然可以溢出。
3. 如果像 1 或 2 中那样声明了溢出，则无法使 div B 分别溢出模态或 A。