title: Horizontally sizing Bootstrap 3 media object body
body: <p>I need to equally size the .media-body elements so they can grow up to the left limit of the page no matter the text they wrap.</p>
  
  <pre><code>&lt;div class="container"&gt;
  &lt;div class="media"&gt;
      &lt;a class="media-left" href="#"&gt;
          &lt;img class="media-object" data-src="holder.js/64x64"&gt;
      &lt;/a&gt;
      &lt;div class="media-body"&gt;
        &lt;p class="text-justify deal-text" &gt;Lorem ipsum dolor sit amet, consectetur dipiscing elit. Duis pharetra varius quam sit amet vulputate. Quisque mauris augue, molestie tincidunt condimentum vitae, gravida a libero.&lt;/p&gt;
     &lt;/div&gt;
      &lt;a class="media-right" href="#"&gt;
          &lt;img class="media-object" data-src="holder.js/64x64"&gt;
      &lt;/a&gt;
  &lt;/div&gt;
    &lt;div class="media"&gt;
      &lt;a class="media-left" href="#"&gt;
          &lt;img class="media-object" data-src="holder.js/64x64"&gt;
      &lt;/a&gt;
      &lt;div class="media-body"&gt;
        &lt;p class="text-justify deal-text" &gt;Lorem ipsum&lt;/p&gt;
     &lt;/div&gt;
      &lt;a class="media-right" href="#"&gt;
          &lt;img class="media-object" data-src="holder.js/64x64"&gt;
      &lt;/a&gt;
  &lt;/div&gt;
    &lt;div class="media"&gt;
      &lt;a class="media-left" href="#"&gt;
          &lt;img class="media-object" data-src="holder.js/64x64"&gt;
      &lt;/a&gt;
      &lt;div class="media-body"&gt;
        &lt;p class="text-justify deal-text" &gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis pharetra varius quam sit amet vulputate. Quisque mauris augue, molestie tincidunt condimentum vitae, gravida a libero.&lt;/p&gt;
     &lt;/div&gt;
      &lt;a class="media-right" href="#"&gt;
          &lt;img class="media-object" data-src="holder.js/64x64"&gt;
      &lt;/a&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Here's the <a href="http://jsfiddle.net/oxba1d0o/" rel="nofollow">snippet</a></p>