title: Inserting an image into a table cell in HTML
body: <p>I am finding it difficult in inserting an image into my table cell. When I am trying to completely fill the table cell with an image, The size of the table cell is increasing and taking up the whole page.
  Here is my code:</p>
  
  <pre><code>&lt;div id="bar"&gt;
      &lt;table class = "BarTable" style="width:100%;height: 100%"&gt;
        &lt;tr&gt;
          &lt;td style="width: 35%"&gt;
             &lt;img src="131AZE.jpg" style="height:100%;width: 100%"&gt;
          &lt;/td&gt;
          &lt;td&gt;Everyone&lt;/td&gt;
         &lt;/tr&gt;
      &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and the css part is:</p>
  
  <pre><code>#bar {
      height:45%;
      width: 100%;
  }
  
  table.BarTable,th,td {
      border:1px solid black;
      border-collapse: collapse;
      line-height: 0;
  }
  </code></pre>