scssを使用したFoundationフレックスボックスの問題

Question

.test { 
    @include flex-grid-row(); 
    .eight { @include flex-grid-column(8); } 
    .four { @include flex-grid-column(4); } 
} 



<div class="test"> 
    <div class="eight" style="background: red; height: 150px;"></div> 
    <div class="four" style="background: blue; height: 150px;"></div> 
</div> 

上記のコードが与えられていると、グリッドスタックは表示されず、並べて表示されません。 .fourが利用可能なスペースをすべて占有していると私は期待していたように、flex-grid-column()から4を削除すると表示されますが、

Answer 1

にフレックスグリッドを設定していることを確認することができます。

私はこの問題は、私はリソースへのNPMとのリンクを使用してインストールされhttp://foundation.zurb.com/sites/docs/flexbox.html#enabling-flexbox-mode

Answer 2

マークアップが正しく表示され、私のflexプロジェクトでうまくいきます。 あなたは、NPM @import "node_modules/foundation-sites/scss/foundation.scss";経由で財団をインポートした後、私はその後、フレキシボックスに真のスイッチを渡す@include foundation-everything(true);に必要なあなたはapp.scss

[] と