Overflow image outside container on left side
<p>Bear with me here, this is kind of hard to explain properly...</p>

<p><a href="https://i.stack.imgur.com/DDrk8.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/DDrk8.png" alt="enter image description here"></a></p>

<p>THIS FIRST PART AS DESCRIBED BELOW IS WORKING FINE.<br>
On this first image you see a browser screen that is wider than my (bootstrap) container. The blue is the whole screen window, the white is the container (with a <code>max-width</code>) with the basic 12 columns from bootstrap.<br>
I want the laptop on the right to be wider then the x-number of columns it has on its bootstrap grid. When the (for example) 7 colums have a width of (for example) 500px and the image is 800px wide, it will naturally overflow the container (if the image is not given a width, ofcourse). So when you make your window smaller (see second image) you just cut of the image a little.   </p>

<p><a href="https://i.stack.imgur.com/6asSz.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/6asSz.png" alt="enter image description here"></a>  </p>

<p>THIS SECOND PART AS DESCRIBED BELOW IS THE PROBLEM...<br>
Now I want to have the same thing on the left side... But When I have 7 colums in my bootstrap, that are (for example) 500px wide, and I have an image inside that, with a width of 800px the overflow happens naturally on the right side again. I would like this to be on the left side!! So something like having a div with an image inside the is aligned to the right, but the overflow is on the left.</p>

<p>THIS IS WHAT IS HAPPENING RIGHT NOW: where the overflow is on the right (when it should be on the left).  </p>

<p><a href="https://i.stack.imgur.com/O72Pg.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/O72Pg.png" alt="enter image description here"></a></p>

<ul>
<li>I do NOT want to strech this image longer than the natural width of the image</li>
<li>I PREFER it being <code>&lt;img&gt;</code>-tags in stead of <code>background-image</code>, but if this is not possible I can accept that. </li>
</ul>

<p>Some Code is provided in this <a href="https://jsfiddle.net/cL2q2cb1/" rel="nofollow noreferrer">JSFiddle</a></p>