Css 引导:一列超出固定宽度容器?

Css 引导:一列超出固定宽度容器?,css,twitter-bootstrap,containers,multiple-columns,Css,Twitter Bootstrap,Containers,Multiple Columns,使用引导4。我有一个网站使用固定宽度的容器。在某些页面上,我希望行的左侧部分仅包含一个图像(img标记或div上的背景,我在这一点上并不特别),我希望该图像从固定宽度容器延伸到窗口边缘。右边的部分是我想保存在容器中的文本 希望这幅图能解释这一点: 能做到吗?我想我大概做到了: .left-bleed { margin-left: calc(-100vw / 2); } <figure class="left-bleed"> <img src="https:/

使用引导4。我有一个网站使用固定宽度的容器。在某些页面上,我希望行的左侧部分仅包含一个图像(img标记或div上的背景,我在这一点上并不特别),我希望该图像从固定宽度容器延伸到窗口边缘。右边的部分是我想保存在容器中的文本

希望这幅图能解释这一点:


能做到吗?

我想我大概做到了:

.left-bleed {
    margin-left: calc(-100vw / 2);
}

<figure class="left-bleed">
    <img src="https://source.unsplash.com/KUfkX6gVwBU/2600x800">
</figure>
。左出血{
左边距:计算(-100vw/2);
}
这会将图像拉离容器并移到视口的左边缘

有用的资料来源:


我的朋友,一切都可以做到