IE rendering help

I am having some trouble trying to get my tabs to look the same in both IE and FF. The padding seems all messed up in IE.

Page in questions: http://www.digitalsomething.com

The tabs that say "Latest News" and "Latest Blogs".

Here is the HTML and CSS in questions:

<div id = "menu_items">
<span style="float: left">
<span class = "tab_active" id = "news_tab">Latest News</span>
<span class = "tab_inactive" id = "blog_tab">Latest Blogs</span>
</span>
<span style="float: right"><a href = "http://feeds.feedburner.com/DigitalSomething"><img src="img/feed.png" alt="RSS Feed" /></a></span>
</div>

HTML:

#menu_items
{
	font-size: 14px;
	border-left: 1px solid #185783;
	margin-bottom: 10px;
	padding: 7px;
	background-image: url(../img/menu_bg.jpg);
	height: 16px;
}
.tab_active
{
	padding: 7px;
	margin-left: 2px;
	margin-right: 2px;
	background: url(../img/tab_bg.jpg) bottom;
	color: #364D78;
	cursor: pointer;
}
.tab_inactive
{
	padding: 7px;
	margin-left: 2px;
	margin-right: 2px;
	background-color: #52729A;
	color: #000000;
	cursor: pointer;
}

Code (markup):

Any help will be greatly appreciated.