Html 全宽元素：如何使绝对定位的元素在网格内全宽 我有一篇文章在一个格子里 文章正文共有6列 我需要文章正文中的一个项目以达到全宽度（超过6列容器） 我尝试制作全宽的元素是视频/iframe，它需要保持16:9的纵横比 视频/iframe已完全定位

这是目前为止的密码笔

.container{
显示：块；
左边距：自动；
右边距：自动；
最大宽度：1536px；
填充底部：24px；
左侧填充：48px；
右边填充：48px；
宽度：100%；
}
.电网{
显示：网格；
柔性包装：nowrap；
栅隙：16px；
网格模板列：重复（12，1fr）；
左边距：0；
右边距：0；
列表样式类型：无；
利润率：0-8px；
左侧填充：0；
}
.文章布局{
网格柱：2/9；
宽度：自动；
填充顶部：8px；
左侧填充：0；
右边填充：0；
}
.video-player.u-align--全宽{
显示：网格；
栅隙：16px；
网格模板列：重复（7，1fr）；
边缘底部：32px；
位置：相对位置；
宽度：100vw；
高度：自动；
垫底：56.25%；
填充底部：0；
}
.u-align__包装{
垫底：56.25%；
位置：相对位置；
宽度：100vw；
网格柱：1/7；
对齐项目：居中；
/*显示器：flex*/
网格柱：1/-1；
证明内容：中心；
垂直对齐：中间对齐；
}
.video-player\u源.u-align\u容器{
左：0；
位置：绝对位置；
排名：0；
宽度：100%；
身高：100%；
}

知识是一种美德，是一种美德，是一种美德，是一种美德。这是一个大问题。Leo integer malesuada nunc vel risus。我是艾米特·莫里斯·康莫多·奎斯
节食

知识是一种美德，是一种美德，是一种美德，是一种美德。这是一个大问题。Leo integer malesuada nunc vel risus。我是艾米特·莫里斯·康莫多·奎斯
节食

我建议在你的设计中删除你的类

网格

，并在类

中添加
宽度：100%
。根据我观察到的
.u-align\u包装
类包含
宽度：100vw

这是完整的预览


.container{
显示：块；
左边距：自动；
右边距：自动；
最大宽度：1536px；
填充底部：24px；
左侧填充：48px；
右边填充：48px；
宽度：100%；
}
.电网{
显示：网格；
柔性包装：nowrap；
栅隙：16px；
网格模板列：重复（12,1fr）；
左边距：0；
右边距：0；
列表样式类型：无；
利润率：0-8px；
左侧填充：0；
}
.文章布局{
网格柱：2/9；
宽度：自动；
填充顶部：8px；
左侧填充：0；
右边填充：0；
}
.video-player.u-align--全宽{
显示：网格；
栅隙：16px；
网格模板列：重复（7,1fr）；
边缘底部：32px；
位置：相对位置；
宽度：100vw；
高度：自动；
垫底：56.25%；
填充底部：0；
}
.u-align__包装{
垫底：56.25%；
位置：相对位置；
宽度：100%；
网格柱：1/7；
对齐项目：居中；
/*显示器：flex*/
网格柱：1/-1；
证明内容：中心；
垂直对齐：中间对齐；
}
.video-player\u源.u-align\u容器{
左：0；
位置：绝对位置；
排名：0；
宽度：100%；
身高：100%；
}

知识是一种美德，是一种美德，是一种美德，是一种美德。这是一个大问题。Leo integer malesuada nunc vel risus。我坐在阿梅特·莫里斯·康莫多·奎斯的位子上

知识是一种美德，是一种美德，是一种美德，是一种美德。这是一个大问题。Leo integer malesuada nunc vel risus。我坐在阿梅特·莫里斯·康莫多·奎斯的家里。

如果您删除
位置：相对.u-align\uu包装器中选择code>样式，并添加
位置：相对
到您的父div，即
.container
类，则视频将是全宽和全高的。
谢谢，但我无法摆脱网格，因为页面上的许多其他内容都依赖于它。