Ошибка линии Foundation Line

Question

У меня есть сетка Foundation framework, и я установил 2 столбца в одну строку. Я испытываю нежелательный разрыв строки из первого столбца в следующий. Проблема существует в «большом» размере экрана. Первый столбец - «большой-2», а второй - «большой-4 с большими центрами», и по какой-то причине изображение во втором столбце, по-видимому, находится ниже разрыва строки от первого элемента столбца h2, а не в порядке, как и должно быть. Несомненно, содержимое каждого столбца должно быть выровнено с верхней частью строки, если не указано иное?

Here's the codepen

Answer 1

Вы должны удалить «большой-центрированный» класс из второго столбца для «линии разрыва» исчезнет, ​​или поставить второй столбец в отдельной строке. В строке может быть только один столбец CENTERED, см. Grid docs.

<div class="row"> 
    <div class="small-3 small-centered columns">3 centered</div> 
</div> 
<div class="row"> 
    <div class="small-6 large-centered columns">6 centered</div> 
</div> 
<div class="row"> 
    <div class="small-9 small-centered large-uncentered columns">9 centered</div> 
</div> 
<div class="row"> 
    <div class="small-11 small-centered columns">11 centered</div> 
</div>