8471 shaares
203 private links
203 private links
.full-width {
width: 100vw;
margin-left: 50%;
transform: translate3d(-50%, 0, 0);
}
Or a responsive approach with CSS grid:
.wrapper {
display: grid;
grid-template-columns:
[full-start] 1fr [wrapper-start]
minmax(0, 70rem) [wrapper-end] 1fr [full-end];
/* Optional gap */
column-gap: var(--pad, 1rem);
}
Then
.wrapper > * {
grid-column: wrapper;
}
.wrapper > .full-width {
grid-column: full;
}