复杂的博客文章布局与全宽英雄图像和侧边栏

Question

我正在尝试在Bootstrap 4中实现以下布局。

请注意：

• image，header和.entry-content属于main元素
• .sidebar位于aside元素
内

我受到这种布局的限制（使用Roots Sage）。

image和header应弹出main并延伸到article的全宽。

我意识到使用一些基本的绝对定位技术可能并不太复杂。复杂性是由header根据文本长度和垂直方向可变高度的事实引入的。 aside的位置应相对于此进行调整。

愿意为此提供一些帮助。谢谢！