センターアラインメントファウンデーション6ドロップダウン

Question

私は、水平に中央に位置するFoundation 6ドロップダウンを表示しようとしています。ツールチップとしてドロップダウンを使用しようとしています。なぜなら、私のニーズに合っていて、リッチなHTMLをツールチップに挿入することができるからです。

ファンデーション6のドロップダウンは、クラス.top .right .bottom .leftを追加して配置できます。これらのクラスはFoundationコアJavascriptによって解析され、要素は動的に計算されますtop:とleft:属性です。

このため、leftまたはtransform: translateプロパティを要素に追加することは、位置決め属性を動的に計算するときにFoundationがこれを考慮するという事実によって無効になります。

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>