Generally, if you’d like to rock a 100% full-width (viewport) image from inside a container, additional markup would be required to make it happen.
You’d have to close the container, add your 100% image, then reopen the container. Rinse repeat for each instance.
That’s all well and good, but this becomes a bit of an issue when creating blog post templates / layouts in a CMS like WordPress. Sure, you can write some custom functions to wrap images with the required markup, but honestly, that’s a pain in the ass. Especially if you only want some images or elements to go full-width.
Of course, you could write a js solution to calculate the distances and offsets, then recalc on resize, but that’s also kinda grimey.
No worries playas… there’s a better way – free from extra markup, functions, helpers, or js retardery.