JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
  Inhalt 123
  <div class="drueberraus">
    Inhalt 456
  </div>
  Inhalt 123
  <div class="vollebreite">
     Inhalt 789
  </div>
  Inhalt 123
</div>

CSS

.wrapper {
  max-width: 150px;
  margin: 0 auto;
  background-color: #f88;
}
.drueberraus {
  margin: 0 -100px;
  background-color: #8f8;
}
.vollebreite {
  margin-left: calc(-100vw / 2 + 150px / 2);
  margin-right: calc(-100vw / 2 + 150px / 2);
   background-color: #88f;
}