Center DropDown Menu inside itself

Question

This is my scenario

(JsFiddle Link at the end of page)

I want to center the buttons "Home", "Categories", "Work", ecc ecc inside the same bar.

In other words, now is on left side; I want to center it.

<nav id="menu-wrap">    
    <ul id="menu">
        <li><a href="/">Home</a></li>

        <li>
            <a href="">Categories</a>
            <ul>
                <li>
                    <a href="">CSS</a>
                    <ul>
                        <li><a href="">Item 11</a></li>

                        <li><a href="">Item 12</a></li>
                        <li><a href="">Item 13</a></li>
                        <li><a href="">Item 14</a></li>
                    </ul>               
                </li>
                <li>
                    <a href="">Graphic design</a>

                    <ul>
                        <li><a href="">Item 21</a></li>
                        <li><a href="">Item 22</a></li>
                        <li><a href="">Item 23</a></li>
                        <li><a href="">Item 24</a></li>
                    </ul>               
                </li>

                <li>
                    <a href="">Development tools</a>
                    <ul>
                        <li><a href="">Item 31</a></li>
                        <li><a href="">Item 32</a></li>
                        <li><a href="">Item 33</a></li>
                        <li><a href="">Item 34</a></li>

                    </ul>               
                </li>
                <li>
                    <a href="">Web design</a>               
                    <ul>
                        <li><a href="">Item 41</a></li>
                        <li><a href="">Item 42</a></li>
                        <li><a href="">Item 43</a></li>

                        <li><a href="">Item 44</a></li>
                    </ul>   
                </li>
            </ul>
        </li>
        <li>
            <a href="">Work</a>
            <ul>

                <li>
                    <a href="">Work 1</a>
                    <ul>
                        <li>
                            <a href="">Work 11</a>      
                            <ul>
                                <li><a href="">Work 111</a></li>
                                <li><a href="">Work 112</a></li>

                                <li><a href="">Work 113</a></li>
                            </ul>                           
                        </li>
                        <li>
                            <a href="">Work 12</a>
                            <ul>
                                <li><a href="">Work 121</a></li>
                                <li><a href="">Work 122</a></li>

                                <li><a href="">Work 123</a></li>
                            </ul>                           
                        </li>
                        <li>
                            <a href="">Work 13</a>
                            <ul>
                                <li><a href="">Work 131</a></li>
                                <li><a href="">Work 132</a></li>

                                <li><a href="">Work 133</a></li>
                            </ul>                           
                        </li>
                    </ul>                   
                </li>
                <li>
                    <a href="">Work 2</a>
                    <ul>
                        <li>

                            <a href="">Work 21</a>
                            <ul>
                                <li><a href="">Work 211</a></li>
                                <li><a href="">Work 212</a></li>
                                <li><a href="">Work 213</a></li>
                            </ul>                           
                        </li>

                        <li>
                            <a href="">Work 22</a>
                            <ul>
                                <li><a href="">Work 221</a></li>
                                <li><a href="">Work 222</a></li>
                                <li><a href="">Work 223</a></li>
                            </ul>                           
                        </li>

                        <li>
                            <a href="">Work 23</a>
                            <ul>
                                <li><a href="">Work 231</a></li>
                                <li><a href="">Work 232</a></li>
                                <li><a href="">Work 233</a></li>
                            </ul>                           
                        </li>

                    </ul>                   
                </li>
                <li>
                    <a href="">Work 3</a>
                    <ul>
                        <li>
                            <a href="">Work 31</a>
                            <ul>

                                <li><a href="">Work 311</a></li>
                                <li><a href="">Work 312</a></li>
                                <li><a href="">Work 313</a></li>
                            </ul>                           
                        </li>
                        <li>
                            <a href="">Work 32</a>

                            <ul>
                                <li><a href="">Work 321</a></li>
                                <li><a href="">Work 322</a></li>
                                <li><a href="">Work 323</a></li>
                            </ul>                           
                        </li>
                        <li>
                            <a href="">Work 33</a>

                            <ul>
                                <li><a href="">Work 331</a></li>
                                <li><a href="">Work 332</a></li>
                                <li><a href="">Work 333</a></li>
                            </ul>                           
                        </li>
                    </ul>                   
                </li>

            </ul>       
        </li>
        <li><a href="">About</a></li>
        <li><a href="">Contact</a></li>
    </ul>
</nav>

http://jsfiddle.net/uHuHE/

Answer 1

Just assign text-align: center; to #menu ul a

Demo

---

Side Note: If you want to be over specific with the nested level text alignment, you can always use > selector so say for example you want to align the text in 1st drop down level, than you can simply use

ul#menu > li {
   /* Targets main menu items */
}

ul#menu > li > ul > li > a {
   /* Targets 1st level dropdown */
}

And so on...

---

As you commented, you wanted to center the main menu items, than use #menu-wrap in the place of #menu {} declaration, assign some fixed width to your #menu and than use margin: auto;

Demo 2