Попытка центрировать вложенную колонку в фундаменте zurb

Question

Я использую Zurb foundation, и я пытаюсь центрировать вложенную колонку, но по какой-то причине я не могу понять, это не центрирует ее. Может ли кто-нибудь пролить свет на это, пожалуйста?

<div class="container"> 
    <div class="row"> 
     <div class="12 columns"> 
      <div class="row"> 
       <div class="4 centered columns"> 
        <h1>My Content</h1> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

Спасибо!

Answer 1

Возможно, было 4 была неправильная, и вы должны попробовать four и то же самое для двенадцати.

Answer 2

Если вы используете Foundation 3, попробуйте

<div class="container"> 
    <div class="row"> 
    <div class="12 columns"> 
     <div class="row"> 
     <div class="4 centered columns"> 
      <h1>My Content</h1> 
      </div> 
     </div> 
     </div> 
    </div> 
    </div> 
</div> 

Я нашел закрывание <div> теги были несбалансированными.

Если вы используете Foundation 4, используйте

<div class="container"> 
    <div class="row"> 
    <div class="large-12 columns"> 
     <div class="row"> 
     <div class="large-4 large-centered columns"> 
      <h1>My Content</h1> 
      </div> 
     </div> 
     </div> 
    </div> 
    </div> 
</div>