How to Fake a Half-Width Responsive Background Image
I recently ran into a design that had needed background images on half-width columns but that also needed to cover the margins going all that way to the edge of the screen (i.e. outside of the half-width grid column) and I found that the best way to do it was to fake it with a percentage based background position.
The column on the right takes up 7 of 12 grid column within a max-width container of 1200px. The background image needs to cover the entire right side of the section no matter how wide the screen gets.