Re: Gap in images in table
Wrap the whole thing, from beginning to end, in a div with this style:
<div style="width: 800px; margin: 0 auto;">
Put that before the beginning table tag, and then close it after the ending </table> tag.
You can separate the style from the template html by calling the div something like
<div id="wrapper"> in your template then adding this to your style.css:
margin: 0 auto;
In either case, the margin is 0 top and bottom, and auto left and right, which means it will be centered horizontally in the browser no matter what the size of the browser viewport.