Html 如何添加包含绝对定位子对象的轮廓，而不在父对象上设置默认高度

我试图将边框添加到整个div中，并在鼠标悬停的同时显示绝对定位的子对象，因为子对象设置为绝对添加边框到父对象忽略子对象，所以我为父对象设置了默认高度，这与我尝试执行的操作相反

我已经将子对象设置为绝对，这样它就不会将下面的元素推到分隔缝上，我希望子对象浮在顶部

*，
*：：之后，
*：：之前{
保证金：0；
填充：0；
}
.clearfix:之后{
内容：“；
/*旧浏览器不支持空内容*/
可见性：隐藏；
显示：块；
身高：0；
明确：两者皆有；
}
身体{
填充：10雷姆；
}
.视频{
宽度：220px；
背景色：#fff；
位置：相对位置；
过渡：所有500ms；
显示：块；
}
.视频详细信息{
宽度：继承；
身高：继承；
显示：无；
不透明度：0；
位置：绝对位置；
}
.视频：悬停{
盒影：0 14px 28px rgba（0,0,0,0.25），0 10px 10px rgba（0,0,0,0.22）；
外形：10px纯白；
}
.video:hover.video\u详细信息{
不透明度：1；
显示：块；
}

文件
视频名称视频名称

视频号码
S T A R S

我的同僚们都是精英。雷佩拉特，努姆夸姆·多洛伦！年，eligendi发明者。

视图4.6k
细节

这就是你想要的

删除

轮廓

并设置

填充

我不知道你是否需要提纲。但这就是你的

gif图像的样子


*，
*：：之后，
*：：之前{
保证金：0；
填充：0；
}
.clearfix:之后{
内容：“；
/*旧浏览器不支持空内容*/
可见性：隐藏；
显示：块；
身高：0；
明确：两者皆有；
}
身体{
填充：10雷姆；
}
.视频{
宽度：220px；
背景色：#fff；
位置：相对位置；
过渡：所有500ms；
显示：块；
填充：30px；
}
.视频详细信息{
宽度：继承；
身高：继承；
显示：无；
不透明度：0；
位置：绝对位置；
底部：-130px；
左：0；
}
.视频：悬停{
盒影：0 14px 28px rgba（0,0,0,0.25），0 10px 10px rgba（0,0,0,0.22）；
}
.video:hover.video\u详细信息{
不透明度：1；
显示：块；
背景：#fff；
填充：0 30px 30px；
盒影：029px23pxRGBA（0,0,0,0.25），013px27pxRGBA（0,0,0,0.22）；
}

文件
视频名称视频名称

视频号码
S T A R S

我的同僚们都是精英。驱虫
多洛伦！年，eligendi发明者。

视图4.6k
细节