Zurb Foundationのフレックスボックスクラスを動作させるには？

Question

私はFoundation 6を使用していて、ドキュメントhereに記載されているように、Flexboxクラスを行と列に適用したいと考えています。

私のHTMLは次のようになります。

<div class="row header align-middle"> 
    <div class="large-5 columns"> 
    <div class="header__title"> 
     <h1>Title</h1> 
    </div> 
    </div> 
    <div class="large-7 columns search-form"> 
    <form>etc</form> 
    </div> 
</div> 

が、私はここで何を取得。私はまた、無影響するように、列要素にalign-self-middleクラスを使用してみました例：

<div class="large-7 columns search-form align-self-middle"> 

をし、両方の組み合わせを試してみました。インスペクタで

私は例えば、framework.cssから適用されているいくつかのスタイルを参照してください：

.align-middle { 
    -webkit-align-items: center; 
    -ms-flex-align: center; 
    align-items: center; 
} 

誰もが、私はこの作業を取得するために必要なものを知っているだろうか？

Answer 1

scssバージョンを使用している場合、app.scssには次のものが含まれています。

// @include foundation-grid; 
@include foundation-flex-grid; 

//@include foundation-float-classes; 
@include foundation-flex-classes; 

コメントアウトfoundation-grid & foundation-float-classesとのコメントを外しfoundation-flex-grid & foundation-flex-classes