Как такое сверстать?

Question

[MegaPuxapb]

Как сверстать зеленый блок, на сетке бс4?

Answer 1

[noeer]

Можно сделать так

<div class="section">
	<div class="container">
		<div class="green"></div>
	</div>
</div>

.section{
	overflow: hidden;
}
.green{
	height: 100px;
	background: green;
	width: 100vw;
}

Comments

[MegaPuxapb]

спасиб, работает.
А на левую сторону как?

[noeer]

MegaPuxapb, если в левую, то так

<div class="section">
    	<div class="container">
    		<div class="clearfix">
    			<div class="green float-right"></div>
    		</div>
    	</div>
    </div>

Answer 2

[Dzhafari]

.green {
    position: relative;

    width: calc(100vw + 80px - ((100vw - 100%) / 2));
    left: calc(((100vw - 100%) / 2) + 80);
}

пояснение для width:
(100vw - 100%) / 2 -> расчет одного бокового отступа контейнера (padding-left + margin-left у контейнера)
80px -> значение бокового padding'а контейнера (с одной стороны)

пояснение для left:
(100vw - 100%) / 2 -> расчет одного бокового отступа контейнера (padding-left + margin-left у контейнера)
+ 80px - компенсируем padding контейнера

80px - меняй это значение в зависимости от padding'ов в твоем контейнере
будет работать если box-sizing: border-box у контейнера