Фундаментная XY сетка полной ширины для некоторых ячеек

Question

Мне интересно, можно ли задать полную ширину для некоторых ячеек на сетке Foundation 6.5 XY.

Я знаю, что для контейнера-сетки можно установить значение Fluid или *.1005 * full , но я намерен установить в одном контейнере сетки полную ширину некоторых ячеек.

 <div class="grid-container">
  <div class="grid-x">
    <div class="cell small-12">
      Contained cell.
    </div>

    <div class="cell small-12 full-width-possible">
      Full width cell possible?
    </div>

    <div class="cell small-12">
      Contained cell.
    </div>
  </div>
</div>

Я не нашел другого варианта, кроме создания отдельного полного контейнера.

Есть идеи?Спасибо!

Answer 1

Используя .small-12, вы устанавливаете ячейку на 100% ширины.

Поэтому для ширины жидкости я бы предложил вам обернуть только ячейку, которая должна содержаться в .grid-container ижидкие без grid-container.

Answer 2

Я думаю, что вам нужно иметь вложенную ячейку - контейнер с шириной от края до края области просмотра, в то время как его контейнер остается шириной 1200 пикселей (независимо от значения по умолчанию для Foundation).

Опция, которую вы могли быпопробуйте использовать смещения.Например,

HTML

<div class="grid-container full">
  <div class="grid-x">
    <div class="cell small-10 small-offset-1">
      Contained cell.
    </div>
    <div class="cell small-12">
      Full width cell possible?
    </div>
    <div class="cell small-10 small-offset-1">
      Contained cell.
    </div>
  </div>
</div>

Пример результата