[HTML][CSS]Wyśrodkowanie menu Opcje

[Joshio]

Mam problem z wyśrodkowaniem menu. Jak zrobić aby menu było na środku? - teraz zaczyna się od lewej strony:

[HTML] pobierz, plaintext 
<nav id="mainmenu">
 
	<ul>
		<li>Home</a></li>
		<li><a href="#">Wyposażenie</a></li>
		<li><a href="#">Pracownicy</a></li>
		<li><a href="#">Galeria</a></li>
		<li><a href="#">Kontact</a></li>
	</ul>
 
</nav><!--mainmenu-->
[HTML] pobierz, plaintext 

[CSS] pobierz, plaintext 
#mainmenu{
	background-image: url(../images/menu.png);
	font-family: 'source_sans_proregular';
	text-transform: uppercase;
	height:71px;
	font-size:22px;
	color:#2f2f2f;
}
 
#mainmenu ul{
	padding: 24px 0 0 20px;
}
 
#mainmenu ul li{
	margin: 0 10px 0 10px;
	float: left;
}
[CSS] pobierz, plaintext 

Wygląda to tak a chce aby było na środku
(IMG:http://files.tinypic.pl/i/00232/qgdobxjft9wk.png)

[b4rt3kk]

Dopisz w css:

[HTML] pobierz, plaintext 
#mainmenu ul{
	padding: 24px 0 0 20px;
        margin: auto;
}
[HTML] pobierz, plaintext 

Może nie działać pod IE, należy wtedy użyć dla elementu nadrzędnego text-align: center;

[Joshio]

Właśnie w ten sposób nie działa :/ już próbowałem wcześniej.

[b4rt3kk]

Właśnie w ten sposób nie działa :/ już próbowałem wcześniej.

Zapomniałem jeszcze o jednej istotnej kwestii:

[PHP] pobierz, plaintext 
#mainmenu ul{
	padding: 24px 0 0 20px;
        margin: auto;
        display: inline;
}
[PHP] pobierz, plaintext 

[Joshio]

Niestety ale ten sposób też nie działa :/ tworzenie dodatkowych div'ow też nic nie dało...

/Edit...

Znalazłem sposób choć nie jest on taki łatwy - wrzucam go tu może się komuś kiedyś przyda

HTML - Bez Zmian

[CSS] pobierz, plaintext 
#mainmenu{
	background-image: url(../images/menu.png);
	font-family: 'source_sans_proregular';
	text-transform: uppercase;
	height:71px;
	font-size:22px;
	color:#2f2f2f;
	text-shadow:1px 1px #ccc;	
	width: 100%; 
	overflow: hidden;
}
 
#mainmenu ul{
	padding: 24px 0 0 20px;
	list-style: none; 
	position: relative; 
	float: left; 
	display: block; 
	left: 50%;
}
 
 
#mainmenu ul li{
	margin: 0 10px 0 10px;
	float:left;
	position: relative;
	display: block;
	right: 50%;
}
[CSS] pobierz, plaintext 

Teraz menu jest na środku i zmienia się dynamicznie wraz z dodaniem pozycji

Ten post edytował Joshio 11.01.2013, 12:26:18