CSS: make a component full-width

Often, when supporting older projects, you can't make significant changes and must work within existing constraints. You may then need to render a newly created hero banner on a page with limited width.

Use this CSS to make an element full-width even if the block's parent has max-width:
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);