JSFiddle - React, Tailwind, and code Playground

HTML

<div id="mMid">
    <div id="mTrick">
      <div id="mBot">
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
        Content<br>
      </div>
    </div>
</div>

CSS

#mMid {
    width:1001px;
    border: 1px solid blue;
    padding-bottom: 170px;
}

#mTrick {
    border: 1px solid green;
    background:url(/images/mMid.png) top left repeat-y;
}
#mBot {
    background:url(/images/mBot.png) bottom left no-repeat;
    /* width:  1001px;  not needed. It will borrow the size from it's parent */
    border: 1px solid red;
    margin-bottom: -170px;
}