image span full width of screen

Hello everyone!

I am using a template and i would like to be able to add an image into the body content that will span the full width of the screen.

This is a screenshot from another website that illustrates what I’d like to do: https://www.lensoutloud.com/vsco.jpg. This template already gives me the ability to organize content into columns. I’d also like be able to throw in a full width image where I want to.

The problem (I think) I am having must be in some code in the CSS that is forcing my image’s left margin to be constrained within the #Container or #fullwdith classes in the CSS. Here’s a test of what I tried to do https://www.lensoutloud.com/test-layout.

Heck, maybe I’m pinpointing the wrong classes all together. With that being said, I’m a complete noob to all of this.

If you go to my homepage (www.lensoutloud.com), you can see there’s a full width slider built into that particular page template. I’m not attempting to insert a full width slider at different places in the body of the content. I’d just like to insert a full width image.

Do I need to override something in the CSS or something?

Thanks in advance for your time everyone!