どのようにブロックボディファンデーション6を中心に？

Question

私は他のページに拡張するためにbase.htmlページを作成しましたが、何を試してもコンテンツを{％block body％}に集中できません 誰が問題がどこにあるのか分かりますか？ 私はfoundation 6を使用していますが、app.cssで何も編集していません。 詳細情報が必要な場合はお知らせください。

{% block body %} 

<div class="row"> 
    <div class="large-3 large columns"></div> 
     <div class="large-6 large-centered columns"> 

      <h1>CONTENT FROM OTHER PAGES</h1> 
      <p>Here is some content.</p> 

     </div> 
<div class="large-3 large columns"></div> 
</div> 

{% endblock %} 

Answer 1

あなたは財団6を使用している場合は、私はfloatとフレックスグリッドをダンプし、XYグリッドを使用して開始することをアドバイス、それはあなたが何をしようとして行うためにヘルパークラスですでに付属しています。

{% block body %} 
<div class="grid-container"> 
    <div class="grid-x align-center"> 
      <div class="shrink cell"> 

       <h1>CONTENT FROM OTHER PAGES</h1> 
       <p>Here is some content.</p> 

      </div> 
    </div> 
</div> 

{% endblock %} 

あなたは、コンテナ内シュリンク（強制的に可能な限り少ないスペースとして使用するセルをシュリンク）を使用して、単一のセルを持っていることを確認しますが、そのすべてのコンテンツが中心とされdiv.grid-x.align-センターはなります残りの部分を実行します（コンテナ内のすべてのセルを中央に配置し、中央に配置されたセルを効果的に作成します）。

ありますそんなに多くを行うには、ちょうどあなたが

（少なくとも基礎6.4.1を使用するために、超重要）LATEST FOUNDATIONコンパイルを使用してください