如何居中导航菜单-菜单项的左边缘和右边缘都必须居中吗？

Question

我要创建一个包含9个菜单项的下拉菜单。它应该位于2行中（5 + 4个项目）并且其项目应该居中，但是当使其居中时，我将li的宽度设置为20％，以便在一行中获得5个项目。将其居中时，将text-align : center的{​​{1}}设置为li，但由于列表项名称不同而无法正常工作，因此顶部项的边缘和底部项的边缘不在同一行。见所附图片here

          <li class="menu">
                <i class="fa fa-angle-down "></i>
                <div class="dropmenu">
                        <div class="inner-dropmenu">
                            <ul class="sub-menu">
                                <li><a href="#"><span class="nav nav"></span> Link1</a></li>
                                <li><a href="#"><span class="nav nav1"></span> Link222</a></li>
                                <li><a href="#"><span class="nav nav2"></span> Link33</a></li>
                                <li><a href="#"><span class="nav nav3"></span> Link4444</a></li>
                                <li><a href="#"><span class="nav nav4"></span> Link_a </a></li>
                                <li><a href="#"><span class="nav nav5"></span> Link9</a></li>
                                <li><a href="#"><span class="nav nav6"></span> Link_bb </a></li>
                                <li><a href="#"><span class="nav nav7"></span> Link_ccc</a></li>
                                <li><a href="#"><span class="nav nav8"></span>Link_dd</a></li>
                            </ul>
                        </div>
                    </div>
                </li>