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

【问题标题】：child div content not visible when outside parent div在父 div 之外时子 div 内容不可见
【发布时间】：2019-03-17 00:44:07
【问题描述】：

我在另一个 div 中有 3 个彼此相邻的 div。
当我将鼠标悬停在 div 上时，div 会弹出。
这是可行的，但正如您在图像中看到的那样，div 内容被他的父 div （红色/粉红色垂直条）剪切掉了。
如何使内容可见？

Complete JS Fiddle Demo

.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;
}

【问题讨论】：

创建一些 demo 或发布您的相关 HTML 代码。没有代码没有解决方案。
我已经用 jsfiddle 演示编辑了这个问题
原因是您为 .packet:hover 在 css 中指定的边距。最好使用 transform:scale。我有更好的解决方案。可以用吗？
检查这是link
如果我使用 jQuery，那不是更好的选择吗？因为 IE 9 支持转换，但我也想要一个 IE 8 兼容选项。我似乎也无法让它与转换一起使用，所以也许你可以显示编辑后的 CSS？

标签： html css position css-position parent-child

【解决方案1】：

根据您的要求，我认为这会更合适。

DEMO

CSS

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

【讨论】：

我只是想发布相同的解决方案，我已经删除了溢出。我从未使用过该 css 元素，所以我不知道它的作用。感谢您与我一起思考解决方案。
我现在遇到了另一个问题。将鼠标悬停在 div 上时，div 未对齐。我创建了一个新的更新 JSFiddle。您需要调整结果视图，以便您可以看到至少 3 个彼此相邻的 div。 jsfiddle.net/famouswolluf/7cv52cay/1