title: Stop scrolling at last image in html
body: <p>I have the following html-</p>
  
  <pre><code>&lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /&gt;
  &lt;title&gt;Untitled Document&lt;/title&gt;
     &lt;style type="text/css"&gt;
      .style1 {
          width: 2454px;
  
      }
     &lt;/style&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;table width="5964" border="0" cellspacing="13"&gt;
    &lt;tr&gt;
     &lt;td width="3484"&gt;&lt;img src="images/square.jpg" width="850" height="534" /
     &lt;img src="images/circle.jpg" width="850" height="534" /&gt;&lt;/td&gt;
     &lt;td class="style1"&gt;&lt;img src="images/rectangle.png" width="1134" height="534" /&gt;&lt;/td&gt;
    &lt;/tr&gt;
  &lt;/table&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p></p>
  
  <p>When I view this page in IE the horizontal scrollbar goes much further than it should, whereas I need it to stop on the last image <code>rectangle.png</code>.</p>
  
  <p>I have tried to alter the CSS making the column width set to auto but this did not work, and also the table width. How can I get round this?</p>