Проблема с FireFox

[Scorpio2011]

В общем проблема в следующем. Сделал меню сайта во вкладках (взял код с шаблона wordpress). Во всех браузерах работает замечательно кроме FireFox. Вот на скрине пример того как должно выглядить меню в ФФ _http://savepic.org/2278978.jpg, а показывает она сейчас вот так _http://savepic.ru/3101406.jpg. Не могу понять в чем может быть проблема. В javascript'е нет проблем, потому как я удалил вообще всю яву, а проблема осталась той же. Скорее всего проблема в CSS

HTML код меню

<ul id="tabs" class="tabs">
<li><a href="#" rel="tab1" class="selected">Меню 1</a></li>
<li><a href="#" rel="tab2" >Меню 2</a></li>



<div id="tab1" class="tabcontent">
<ul>
<li><a href="/" >Ссылка</a><br></li>
<li><a href="/" >Ссылка</a><br></li>
<li><a href="/" >Ссылка</a><br></li>
<li><a href="/" >Ссылка</a><br></li>
</ul>
</div>

<div id="tab2" class="tabcontent">
<ul>
<li><a href="/" >Ссылка</a><br></li>
<li><a href="/" >Ссылка</a><br></li>
<li><a href="/" >Ссылка</a><br></li>
</ul>
</div></ul>

<script type="text/javascript">
var countries=new ddtabcontent("tabs")
countries.setpersist(false)
countries.setselectedClassTarget("link")
countries.init()
</script>
<!-- ^^^^^^^^^^^^^^ tabbed content ^^^^^^^^^^^^^^ -->

А Вот CSS

/* NAV MENU */
.tabs {
background: url("../images/block_bottom2.png") no-repeat bottom right;
margin:0 0 15px 24px;
padding:0 0 10px 0;
width:318px;
}

.tabs li {
	width: 157px;
	float: left;
	display: inline;
	margin-right: 2px;
    overflow: hidden;
}

.tabs li a {
text-decoration:none;
font-size:1.45em;
font-weight:normal;
text-transform:uppercase;
	width: 157px;
	float: left;
    text-align: center;
	display: block;
    line-height: 32px;
	height: 29px;
	background: url("../images/nav_menu_off.png") no-repeat;
}

.tabs li a span{color:#cd3333;}

.tabs li a:hover {
	display: block;
	color:#000000;
}


.tabs li a.selected {
	display: block;
	background: url("../images/nav_menu_on.png") no-repeat;




}
/***************** CSS For TAB Content *******************/
.tabcontent {
padding:10px 0 0 0;
margin-right: 2px;
width:316px;
	background: #deecfe;
	overflow: hidden;

}


.tabcontent a, .tabcontent a strong {
	color: #366799;
	line-height: 1.4em;
}

.tabcontent a:hover, .tabcontent a:hover strong {
	color: #408ddb;
}

.tabcontent ul li {
	width: 316px;
	display: block;
	background-position: left 6px;
	border-bottom: 0px dashed #eee;
	padding-bottom: 3px;
	margin-bottom: 3px;
	padding-left: 17px;
	line-height: 1.3em;
}

.tabcontent ul li a {
width: 257px;
padding:0 0 0px 10px;
background:url("../images/rarr.gif") no-repeat left center;
margin-bottom:5px;
text-align:left;
text-transform:none;
font-size:1.2em;
height: 10px;
line-height: 0.9em;
}
.tabcontent ul li a:hover {
	color: #408ddb;
}

.tabcontent ul li span {
	display: block;
	color: #999;
}
/***************** CSS For TAB Content *******************/
@media print {
	.tabcontent {
		padding-left: 10px;
	display: block !important;
	}
}

/* THE END */

У меня складывается такое мнение что нужно что то добавить в .tabcontent, потому как если удалить overflow: hidden; то меню накладывается на другой блок и вот что получается _http://savepic.ru/3105489.jpg

[psywalker]

Почему <ul id="tabs" не закрыт?