[HELP] How to make table's contents to float on top?

Hello! I got some problem coding my blog.
I wanna have a widget at the bottom of my blog just like the other wordpress themes have..
But it seems I don't know how to code the right one.

Here is my code.. I used Table Please help me if there's something better to use.

<div id=content>
<div id=content align="left">
	<table border="0" width="100%" cellspacing="0" cellpadding="0">
		<tr>
		
			<td>
				<div id=widgetbottom>
					<h3>Archives</h3>
						<ul>
							<?php wp_get_archives('type=monthly'); ?>
						</ul>
				</div>
			</td>
			
			<td>
				<div id=widgetbottom>
					<h3>Recent Posts</h3>
						<ul>
							<?php wp_get_archives('type=postbypost&limit=5'); ?> 
						</ul>

				</div>
			</td>
			
			<td>
				<div id=widgetbottom>
					<h3>Visitors</h3>
					<script type="text/javascript" src="http://feedjit.com/serve/?bc=EEEEEE&amp;tc=494949&amp;brd1=EEEEEE&amp;lnk=333333&amp;hc=333333&amp;ww=160"></script><noscript><a href="http://feedjit.com/">Feedjit Live Blog Stats</a></noscript>
				</div>
			</td>
			
			<td>
				<div id=widgetbottom>
				<h3>Twitter Updates</h3>
						<ul id="twitter_update_list"></ul>
						<a href="http://twitter.com/PinoyEngine" id="twitter-link" style="display:block;text-align:right;">Follow me on Twitter</a>
						<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
						<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/PinoyEngine.json?callback=twitterCallback2&amp;count=5"></script>
				</div>
			</td>
			
			<td>
				<div id=widgetbottom>
				</div>
			</td>
			
		</tr>
	</table>
</div>
</div>

Code (markup):

And here is my CSS for that widgetbotton

#widgetbottom {
background: #ffffff url('images/widgetbottom_top') no-repeat top;
float: left;
width: 170px;
margin: 0px;
border: 1px solid #DDDDDD;
display: inline;
padding-left:10px;
padding-right:10px;
padding-top:10px;
padding-bottom:0px
}

#widgetbottom p {
margin: 0px;
padding: 0px 0px 10px 0px;
}

#widgetbottom a img {
border: none;
margin: 0px;
padding: 0px;
}

#widgetbottom ul {
list-style-type: none;
margin: 0px 0px 10px 0px;
padding: 0px;
}

#widgetbottom ul ul {
list-style-type: none;
margin: 0px;
padding: 0px;
}

#widgetbottom ul li li {
background: #FFFFFF url(images/icon.gif) no-repeat top left;
padding: 0px 0px 5px 20px;
margin: 0px;
}

#widgetbottom ul li ul li {
background: #FFFFFF url(images/icon.gif) no-repeat top left;
padding: 0px 0px 5px 20px;
margin: 0px;
}

Code (markup):

And I am also hoping that each column to be 160 in width.
Thank you, thank you, thank you, thank you, thank you, thank you, for any kind of response.

I am really pleading to make this in my blog.