Float image to the left - how to do it?

Float image to the left - how to do it?
0.0 0

#1
<main class="container">
  <header class="pad-top pad-bottom">
    <h1 class="text-center">A tribute to Ernest Hemingway</h1>
	</header>
 <div class="row">
		<div class="col-xs-12 col-md-4 text-center clear-fix img-rounded"> <img class="img-responsive img-thumbnail pull-left" src="https://i2.wp.com/www.brainpickings.org/wp-content/uploads/2013/11/ernesthemingwayonwriting1.jpg?w=680&ssl=1" alt="Hemingway writing">
		</div>
  <div class="col-xs-12 col-md-8 pad-right pad-left">
			<h2 class="pad-top">About Hemingway</h2>
			<p class="text-justify">Lorem ipsum dolor sit amet, adipiscing lorem, nulla tortor nascetur et pharetra urna sit, etiam enim maecenas eget nulla mauris. Elit porta. Rhoncus molestie, iaculis donec justo nec eu proin integer, ac libero vivamus. Sodales per et, duis in venenatis, tortor vel.
			</p>
    <p class="text-justify">Lorem ipsum dolor sit amet, adipiscing lorem, nulla tortor nascetur et pharetra urna sit, etiam enim maecenas eget nulla mauris. Elit porta. Rhoncus molestie, iaculis donec justo nec eu proin integer, ac libero vivamus. Sodales per et, duis in venenatis, tortor vel.
			</p>
    <p class="text-justify">Lorem ipsum dolor sit amet, adipiscing lorem, nulla tortor nascetur et pharetra urna sit, etiam enim maecenas eget nulla mauris. Elit porta. Rhoncus molestie, iaculis donec justo nec eu proin integer, ac libero vivamus. Sodales per et, duis in venenatis, tortor vel.
			</p>
   </div>
    </div>
   
   <div class="row">
		<div class="col-xs-12 col-md-4">
			<img class="pull-right-xs img-responsive img-thumbnail img-rounded" src="http://www.metmuseum.org/connections/images/c2/c2_hemingway_006.jpg" alt="Hemingway bath tup"/>
     </div>     
     <div class="col-xs-12 col-md-8">
			<h2 class="pad-top">Life in a day of Hemingway</h2>
			<p  class="text-justify">Lorem ipsum dolor sit amet, adipiscing lorem, nulla tortor nascetur et pharetra urna sit, etiam enim maecenas eget nulla mauris. Elit porta. Rhoncus molestie, iaculis donec justo nec eu proin integer, ac libero vivamus. Sodales per et, duis in venenatis, tortor vel.
			</p>
    <p class="text-justify">Lorem ipsum dolor sit amet, adipiscing lorem, nulla tortor nascetur et pharetra urna sit, etiam enim maecenas eget nulla mauris. Elit porta. Rhoncus molestie, iaculis donec justo nec eu proin integer, ac libero vivamus. Sodales per et, duis in venenatis, tortor vel.
			</p>
    <p class="text-justify">Lorem ipsum dolor sit amet, adipiscing lorem, nulla tortor nascetur et pharetra urna sit, etiam enim maecenas eget nulla mauris. Elit porta. Rhoncus molestie, iaculis donec justo nec eu proin integer, ac libero vivamus. Sodales per et, duis in venenatis, tortor vel.
			</p>
   </div>
      </div>
  

  <div class="row">
		<div class="col-xs-12 pad-left pad-right">
			<h2 class="pad-top">Important life events</h2>
			<dl class="dl-horizontal timeline">
				<dt>July 21, 1899</dt>
        <dd>Hemingway was born Ernest Miller Hemingway.</dd>  
        </dl>
        </div>
    </div>

      
</main>
  


#2

Try text-left bootstrap class


#3
<main class="container">
  <header class="pad-top pad-bottom">
    <h1 class="text-center">A tribute to Ernest Hemingway</h1>
	</header>
 <div class="row">
		<div class="col-xs-12 col-md-4 text-center clear-fix img-rounded"> <img class="img-responsive img-thumbnail" src="https://i2.wp.com/www.brainpickings.org/wp-content/uploads/2013/11/ernesthemingwayonwriting1.jpg?w=680&ssl=1" alt="Hemingway writing">
		</div>
  <div class="col-xs-12 col-md-8 pad-right pad-left">
			<h2 class="pad-top">About Hemingway</h2>
			<p class="text-justify">Lorem ipsum dolor sit amet, adipiscing lorem, nulla tortor nascetur et pharetra urna sit, etiam enim maecenas eget nulla mauris. Elit porta. Rhoncus molestie, iaculis donec justo nec eu proin integer, ac libero vivamus. Sodales per et, duis in venenatis, tortor vel.
			</p>
    <p class="text-justify">Lorem ipsum dolor sit amet, adipiscing lorem, nulla tortor nascetur et pharetra urna sit, etiam enim maecenas eget nulla mauris. Elit porta. Rhoncus molestie, iaculis donec justo nec eu proin integer, ac libero vivamus. Sodales per et, duis in venenatis, tortor vel.
			</p>
    <p class="text-justify">Lorem ipsum dolor sit amet, adipiscing lorem, nulla tortor nascetur et pharetra urna sit, etiam enim maecenas eget nulla mauris. Elit porta. Rhoncus molestie, iaculis donec justo nec eu proin integer, ac libero vivamus. Sodales per et, duis in venenatis, tortor vel.
			</p>
   </div>
    </div>
   
   <div class="row">
		<div class="col-xs-12 col-md-4">
			<img class="img-responsive img-thumbnail img-rounded text-left" src="http://www.metmuseum.org/connections/images/c2/c2_hemingway_006.jpg" alt="Hemingway bath tup"/>
     </div>     
     <div class="col-xs-12 col-md-8">
			<h2 class="pad-top">Life in a day of Hemingway</h2>
			<p  class="text-justify">Lorem ipsum dolor sit amet, adipiscing lorem, nulla tortor nascetur et pharetra urna sit, etiam enim maecenas eget nulla mauris. Elit porta. Rhoncus molestie, iaculis donec justo nec eu proin integer, ac libero vivamus. Sodales per et, duis in venenatis, tortor vel.
			</p>
    <p class="text-justify">Lorem ipsum dolor sit amet, adipiscing lorem, nulla tortor nascetur et pharetra urna sit, etiam enim maecenas eget nulla mauris. Elit porta. Rhoncus molestie, iaculis donec justo nec eu proin integer, ac libero vivamus. Sodales per et, duis in venenatis, tortor vel.
			</p>
    <p class="text-justify">Lorem ipsum dolor sit amet, adipiscing lorem, nulla tortor nascetur et pharetra urna sit, etiam enim maecenas eget nulla mauris. Elit porta. Rhoncus molestie, iaculis donec justo nec eu proin integer, ac libero vivamus. Sodales per et, duis in venenatis, tortor vel.
			</p>
   </div>
      </div>
  

  <div class="row">
		<div class="col-md-12 pad-left pad-right text-right">
			<h2 class="pad-top">Important life events</h2>
			<dl class="dl-horizontal timeline">
				<dt>July 21, 1899</dt>
        <dd>Hemingway was born Ernest Miller Hemingway.</dd>  
        </dl>
        </div>
    </div>

      
</main>

and in CSS ;

img { float:left}


#4

You can use the Bootstrap class pull-left