Center align Foundation 6 Dropdown

Question

我试图展示一个水平中心对齐的Foundation 6下拉菜单。我试图使用下拉菜单作为工具提示，因为它更符合我的需求，并允许将丰富的HTML插入到工具提示中。

基金会6个下拉框可以通过添加类.top .right .bottom .left来定位。这些类由Foundation核心Javascript分析，然后给出元素动态计算的top:和left:属性。

因此，在元素中添加任何left或transform: translate属性都是基于在动态计算定位属性时将此考虑在内的事实。

任何想法写一个不同的类到JavaScript？

Answer 1

使用text-center。

<ul class="dropdown menu" data-dropdown-menu> 
     <li> 
      <a href="#">Item 1</a> 
      <ul class="menu text-center"> 
       <li><a href="#">Item 1A</a></li> 
       <li><a href="#">Item 1b</a></li> 
       <li><a href="#">Item 1c</a></li> 
      </ul> 
     </li> 
     <li><a href="#">Item 2</a></li> 
     <li><a href="#">Item 3</a></li> 
     <li><a href="#">Item 4</a></li> 
    </ul>