Horizontales Menü zentrieren.

[Koluth]

Hallo ich habe für ein horizontales Wordpress-Menü folgenden komplizierten Code:

CSS:

/* Navigation */
#access{display:block;float:left;width:100%;margin:0 auto;text-transform: uppercase;}
#access .menu-header,div.menu{font-size:1.3em;margin-left:10px; text-align:center;}
#access .menu-header ul,div.menu ul{list-style:none;margin:0;}
#access .menu-header li,div.menu li{float:left;position:relative;}
#access a{color:#444;display:block;line-height:40px;text-decoration:none;padding:0 10px;}
#access ul ul{box-shadow:0 3px 3px rgba(0,0,0,0.2);-moz-box-shadow:0 3px 3px rgba(0,0,0,0.2);-webkit-box-shadow:0 3px 3px rgba(0,0,0,0.2);display:none;position:absolute;top:40px;left:0;float:left;width:180px;z-index:99999;}
#access ul ul li{min-width:180px;}
#access ul ul ul{left:100%;top:0;}
#access ul ul a{line-height:1em;width:160px;height:auto;padding:10px;}
#access li:hover > a,#access ul ul :hover > a{background:rgba(0,0,0,0.7);color:#DAE3F0;-webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out;-webkit-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;}
#access ul li:hover > ul{display:block;}
#access ul li.current_page_item > a,#access ul li.current-menu-ancestor > a,#access ul li.current-menu-item > a,#access ul li.current-menu-parent > a,* html #access ul li.current_page_item a,* html #access ul li.current-menu-ancestor a,* html #access ul li.current-menu-item a,* html #access ul li.current-menu-parent a,* html #access ul li a:hover{background:rgba(0,0,0,0.7);color:#DAE3F0;}

HTML bzw. PHP:

<div id="access">
<?php wp_nav_menu(array( 'container_class' => 'menu-header', 'theme_location' => 'main-navi',)); ?>			
</div>

Kann mir jemand sagen, wie ich das am Besten horizontal zentriere?

 

[Netzwerkidi]

Zentrieren bezogen worauf?

 

[Koluth]

Naja, das ganze ist in einem Navigations-Div. Dieses Navigations-Div hat eine Breite. In der Mitte soll das Menü sein.

 

[Netzwerkidi]

Schon mal das versucht?

#access{text-align:center; // ohne mehr Code ist es immer schwierig
display:block;float:left;width:100%;margin:0 auto;text-transform: uppercase;}

 

[Koluth]

Habe ich schon versucht, funktioniert leider nicht. Viel mehr Code, der sich auf das Problem bezieht, ist vermutlich nicht vorhanden. Oder kann man irgendwo nachschauen, wie der html-teil hinter den Wordpress-php-Sachen ist? Danke trotzdem für die Antworten.

 

[Netzwerkidi]

Wenn du die Möglichkeit hast, nutze ein live-Tool, um den Code zu ändern und direkt die Veränderung zu sehen.
Wer z. B. mit Firefox arbeitet, kann ganz einfach die Funktion "Element untersuchen (Q)" verwenden, erreichbar über die rechte Maustaste, und dann den CSS-Code anpassen bis es passt.