Chrome Div regions not expanding to full width?
===

I did a search around and couldn't find this already asked but I'm sure it must have come up before and I can't find it. So sorry if this is a duplicate question in advance.

I have a simple site layout I'm working on. I noticed today in chrome that 2 of the div regions don't expand fully to the width. In firefox and IE they do expand fully. The 2 offending div regions do contain tables. Could this be the cause? 

Heres a picture, Chrome on the right, gaps on the top div and bottom footer div:

![Chrome Gaps][1]


  [1]: http://i.stack.imgur.com/TtZTL.jpg


This is the CSS for the two regions:

    .topbar{
    	margin: 0;  <---Added this in a hope to fix it.
    	width:76%;
    	height: 34px;
    	background-image:url('img/topImgBg.png');
    	background-repeat:repeat-x;
    	padding-left: 12%;
    	padding-right: 12%;	
    	color:white;
    	font-size:12px;
    	text-align:right;
    }
    
    .footer{
    	height:15%;
    	width:76%;
    	padding-left:12%;
    	padding-right:12%;
    	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#A1A1A1', endColorstr='#ffffff'); 
    	background: -webkit-gradient(linear, left top, left bottom, from(#A1A1A1), to(#ffffff)); 
    	background: -moz-linear-gradient(top,  #A1A1A1,  #ffffff);
    }

And the body CSS:

    html, body {	
    	margin: 0; 
    	padding: 0;
    	width: 100%; 
    	min-width:1024px;
    	font-family:Verdana;
    	font-size:14px;
    }

TIA