Skip to content

Instantly share code, notes, and snippets.

@wpexplorer
Created June 23, 2025 23:10
Show Gist options
  • Select an option

  • Save wpexplorer/e120f665c6bf18a28117757202de9a37 to your computer and use it in GitHub Desktop.

Select an option

Save wpexplorer/e120f665c6bf18a28117757202de9a37 to your computer and use it in GitHub Desktop.
.wpex-vc-full-width-section,
.wpex-vc-full-width-row {
--vp-width: calc(100vw - var(--wpex-vc-full-width-vp-offset, 0px) - (var(--wpex-site-frame-border-size) * 2));
--vp-width-half: calc(var(--vp-width) / 2);
--wpex-vc-full-width-offset-half: calc(var(--wpex-vc-full-width-offset, 0px) / 2);
position: relative;
width: calc(var(--vp-width) - var(--wpex-vc-full-width-offset, 0px));
inset-inline-start: calc(50% - var(--vp-width-half) + var(--wpex-vc-full-width-offset-half));
// Remove negative margins - ! important !
margin-inline: 0 !important;
}
.wpex-vc-full-width-row:not(.wpex-vc-full-width-row--centered) {
--vp-width: calc(100vw - var(--wpex-scrollbar-width, 0px) - var(--wpex-vc-full-width-vp-offset, 0px) - (var(--wpex-site-frame-border-size) * 2));
}
.wpex-vc-full-width-section--centered {
--wpex-vc-full-width-padding-x: calc(var(--vp-width-half) - 50% - var(--wpex-vc-full-width-offset-half));
padding-inline: var(--wpex-vc-full-width-padding-x);
}
.wpex-vc-full-width-row {
&--centered {
--wpex-vc-full-width-padding-x: calc(var(--vp-width-half) - 50% - var(--wpex-vc-full-width-offset-half) - (var(--wpex-vc-gutter, 0px) / 2) - (var(--wpex-vc-column-gap, 0px) / 2));
padding-inline: var(--wpex-vc-full-width-padding-x);
}
&--no-padding > .vc_column_container > .vc_column-inner {
padding-inline: 0;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment