title: Why is my background color not filling all of my table?
body: <p>I'm having a problem with an image within my table row.  For some reason, the background color will not extend and fill the table row in when I have a picture floating to the left. </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>p.more {
    color: rgb(255, 255, 255);
    font-family: Arial;
    font-size: 18px;
    line-height: 140%;
    margin: 0px;
    text-align: center;
    background-color: #cccccc;
  }
  img.more {
    float: left !important;
    margin: 0px 15px 15px 0px;
    width: 330px;
  }
  span.more {
    line-height: 100%;
    text-align: center;
    font-size: 18px;
  }
  span.moreweelove {
    color: rgb(255, 255, 255);
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;table&gt;
    &lt;tr&gt;
      &lt;td&gt;
        &lt;p class="more"&gt;
          &lt;a href="http://blog.weespring.com/weelove-littlehipsqueaks-knotted-headbands/"&gt;
            &lt;img class="more" src="http://www.weespring.com/media/weelove_littlehipsqueeks.jpg"&gt;
          &lt;/a&gt;
          &lt;br&gt;
          &lt;span class="more"&gt;&lt;span class="moreweelove"&gt;&lt;strong&gt;Modern, Comfy, and Fun Staples&lt;/strong&gt;&lt;/span&gt;&lt;/span&gt;
        &lt;/p&gt;
        &lt;p class="readmore"&gt;
          &lt;strong class="subheading"&gt;BIG LOVE FOR JUNE &amp;amp; JANUARY&lt;/strong&gt;
          &lt;br&gt;
          &lt;br&gt;
          &lt;a href="http://blog.weespring.com/weelove-littlehipsqueaks-knotted-headbands/"&gt;
            &lt;img src="http://www.weespring.com/media/read-more.png"&gt;
          &lt;/a&gt;
          &lt;br&gt;
          &lt;br&gt;
  
        &lt;/p&gt;
      &lt;/td&gt;
    &lt;/tr&gt;
  &lt;/table&gt;</code></pre>
  </div>
  </div>
  </p>