子 div 内容在父 div 之外时不可见

Question

我在另一个 div 中有 3 个 div 彼此相邻。
当我将鼠标悬停在 div 上时，弹出 div。
这是有效的，但正如您在图像中看到的那样，div 内容被他的父级 div（red/pink 竖线）剪切掉了。
如何让内容可见？

.pakket {
    width: 291px;
    height: 371px;
    border: 1px solid #F5F5EF;
    float: left;
    background: url(../images/view.png) no-repeat bottom right;
    margin-left: -1px;
    z-index: 1;
}

.pakket:hover {
    background: #ffffff;
    border: 1px solid #5A5858;
    width: 315px;
    height: 390px;
    margin: -10px -13px -15px -12px;
    z-index: 2;
    position: relative;
}

Answer 1

按照你的要求，我觉得这样更合适

DEMO

CSS

.ma-main-container.col1-layout {
    margin: 20px;
    overflow:visible;
    width: 100%;
}

子 div 内容在父 div 之外时不可见

child div content not visible when outside parent div

html

css

position

css-position

parent-child