JSFiddle - React, Tailwind, and code Playground

HTML

<div class="parent">
    BEFORE CHILD
    <div class="child">
        //content
    </div>
    AFTER CHILD
</div>

CSS

body {
    margin: 0;
    color: #fff
}
.parent { 
    margin: 0 auto;
    padding: 1em;
    width: 768px; 
    background-color: red;
}
.child {
    background-color:blue;
    margin: 1em 0;
    margin-left: calc(-50vw + (768px/2));
    margin-right: calc(-50vw + (768px/2));
    padding: 1em;
    border: 2px solid green;
}