How to make this element?

Question

css

How to properly lay out this element ("Cheap Analogues" block)

Made a :before with a width of 2000px+
Scroll appeared.
Scroll removed html, body {overflow-x: hidden;}
Now the bootstrap modal is buggy (it has padding on the right when called in the overlay).
how to be?

Answer 1

Why not just make this panel the full width of the viewport?
Without stuffing it into a bootstrap container.
And then split into 2 halves, blue and white.

Answer 2

make the section that is full width 1 before, 1 after and set it to overflow: hidden, there will be no problems

Answer 3

.entry-header::before {
    content: '';
    display: block;
    position: absolute;
    height: 100%;
    width: 150rem;
    top: 0;
    left: 100%;
    background-color: inherit;
}