我可以对内容使用max-width，但对背景使用全角吗（） _WordPress主题

我正在开发带有主题选项页面的Wordpress主题。在这些选项中, 可以设置网站的最大宽度, 但是在内容区域方面有些困难。
填写最大宽度后, 页眉和页脚区域将获得最大宽度和边距：O auto; 。
【我可以对内容使用max-width，但对背景使用全角吗（）】内容页面将使用Gutenberg Builder创建, 并且我希望能够将背景属性添加到我使用的块中, 并以全角显示它们, 但是内容将变为之前定义的最大宽度。
HTML：

< header class="site-header"> < div class="header-wrapper"> < /div> < /header> < main class="site-content"> < article class="post-10"> < header> < /header> < div> < /div> < footer> < /footer < /article> < /main> < footer class="site-footer"> < div class="header-wrapper"> < /div> < /footer

CSS：

.header-wrapper, .footer-wrapper, article { max-width: 1366px; margin: 0 auto; }

我得到这个：

文章图片
我希望背景是全角的, 但内容要与页眉和页脚的内容相同。
是否可以为页面的页眉, 内容和页脚部分设置相同的最大宽度, 并确保内容区域中的背景仍为全角？
#1 你可以通过添加add_theme_support(‘ align-wide’ )来激活” 广泛对齐” 和” 完全对齐” ；到你的functions.php文件。然后, 用户可以选择在整个视口宽度上对齐图像。
另请参阅https://wordpress.org/gutenberg/handbook/designers-developers/developers/themes/theme-support/#opt-in-features
但这只是图像, 而不是背景。
对于背景区域/图像, 你可以尝试创建规则区域(内容区域的100％), 这些区域的边距设置如margin-left：calc(-50vw + 50％); 右边距：calc(-50vw + 50％); (与全角Gutenberg块中的相同)和padding-left / padding-right calc(50vw-50％); ：这样, 该块将跨越整个视口宽度, 但是内容区域将具有内容区域的宽度(全宽减去填充)。你还必须将要在” 内容” 列中使用的常规填充添加到这些值。
#2 如果我理解, 那么你的CSS应该如下所示：

.header-wrapper, .footer-wrapper, article header, article div, article footer { max-width: 1366px; margin: 0 auto; } article{ width: 100%; background: blue; }

但仅当文章内的这3个div设置了max-width时
content-block是否由article表示？
更新
我从https://css-tricks.com/full-width-containers-limited-width-parents/重新创建了代码笔
https://codepen.io/anon/pen/eaJyqV
如果可能的话, 你可以将图像放在位置：absolute, 然后将文本放在位置：absolute, 但是我想你的内容块不能这样工作； /