Menu question!

[Kayn]

Check this out:

http://pluh.com/

The menu at the top is working great, but I want it centered while keeping a block display. How do I do this? Here's the CSS (it's messy, I know):

#topbar {
	width: 100%;
	background-color: #0000cc;
	background-image: url(pluh_images/menubar_bg.gif);
	background-repeat: repeat-x;
	margin-top: 5px;
	margin-bottom: -25px;
	margin-left: 0px;
	margin-right: 0px;
	font-size: 10px;
	padding: 0px;
	text-align: center;
	position: absolute;
	z-index: 4;
	color: #000000;
	border-bottom: 1px #000000 solid;
	border-top: 1px #000000 solid;
	white-space: nowrap;
}

#topbar a, #topbar a:active {
	text-align: center;
	font-size: 14px;
	display: block;
	padding: 3px 9px 3px 9px;
	white-space: nowrap;
	text-decoration: none;
	color: #FFFFFF;
	float: left;
	border-right: 1px #000000 solid;
	margin: 0px;

}

#topbar a:hover {
	text-align: center;
	font-size: 14px;
	display: block;
	padding: 3px 9px 3px 9px;
	white-space: nowrap;
	text-decoration: none;
	color: #FFCC00;
	float: left;
	background-color: #0066cc;
	border-right: 1px #000000 solid;
	margin: 0px;

}

Thanks!

[S.Vasiliy]

hi Kayn.I think it will be better for you to remove absolute positioning from #topbar,and then add to it margin-left:auto;margin-right:auto;width:650px(or whatever width you need for your menu).Then wrap #topbar in another div with width:100%;and background same as in #topbar.and some little decoration fixes will be left.good luck

[Kayn]

Ugh, that's not really working for me. The absolute positioning puts it on top of everything else, which is kind of needed right now.

Any other suggestions?

[Tyssen]

S. Vasiliy's right - absolute positioning is the wrong way to go about it. After you've validated your page to remove unnecessary tags (you've got two body tags for instance), take a look at http://css.maxdesign.com.au/listamatic/ for examples on how to create horizontal list menus.