How to make an image stay exactly at the screen left side in Bootstrap, without ruining the text in the same row and its responsiveness?

I want an image to stay exactly on the left side of the screen(fix it to the left side). I want the image to "start" from the screen's side. I managed to do this with

position:fixed; left: -15px;

and it works from the viewpoint of the image, it starts at the screen's left side exactly on every screen I tested. BUT it ruins other things, namely the text on the same row will be on top of the picture, AND if I decrease the windows/screen size it will become more of a mess with the text. What's a better solution?

My code:

<div class="row">
              <div class="col-md-3" id="swoosh">
                <img class="img-responsive" src="img/img1.png">
              </div>
              <div class="col-md-6">
                    <h1>Title of the website</h1>
                    <p class="lead">Use this document as a way to quickly start any new project.<br> All you get is this text and a mostly barebones HTML document.</p>
              </div>
            <div class="col-md-3">
                <img class="img-responsive" src="img/logo.png">
            </div>
        </div>      

I want the first picture, so img1.png to be on the left, the title should be in the middle, and the logo.png on the right. The second image, the logo.png doesn't need to be fixed to the right, just img1 to the left.

I tried to provide the all the info you need, but I'm new here so please tell me if there's anything more you need!

Thank you in advance!