/ / Zurb Foundation: як змінити кількість стовпців у точці зупинки? - css, sass, css-float, рядок, zurb-foundation

Zurb Foundation: як змінити кількість стовпців у точці зупинки? - css, sass, css-float, рядок, zurb-foundation

Я хочу створити розмітку, яка веде себе так:

Портрет

<element-1><element-2>
<element-3><element-4>
<element-5><element-6>

Пейзаж

<element-1><element-2><element-3>
<element-4><element-5><element-6>

У моєму основному файлі SASS я додавав нові HTML-класи за допомогою змішувачів Zurb Foundation:

// Foundation
@import "../bower_components/foundation/scss/foundation/components/grid";

// new grid classes
$small-only-and-landscape: "#{$screen} and (max-width: #{upper-bound($small-range)}) and (orientation: landscape)";
$small-only-and-portrait: "#{$screen} and (max-width: #{upper-bound($small-range)}) and (orientation: portrait)";

@media #{$small-only-and-landscape} {
@include grid-html-classes($size:small-landscape);
}

@media #{$small-only-and-portrait} {
@include grid-html-classes($size:small-portrait);
}

Десь у моєму index.html є щось подібне:

<div class="row">
<div class="small-landscape-4 small-portrait-6 columns">
<a href="pictures.html">Bilder</a>
</div>
<div class="small-landscape-4 small-portrait-6 columns">
<a href="#">Freunde</a>
</div>
<div class="small-landscape-4 small-portrait-6 columns">
<a href="#">Videos</a>
</div>
<div class="small-landscape-4 small-portrait-6 columns">
<a href="#">Basteln</a>
</div>
<div class="small-landscape-4 small-portrait-6 columns">
<a href="#">Spiele</a>
</div>
<div class="small-landscape-4 small-portrait-6 columns">
<a href="#">Audio</a>
</div>
</div>

Це добре працює. Тепер ось моє запитання: Як ви бачите, я використовую "overfull" .row, плаваючи його елементи таким чином, що вони переставляють у "двоколонну сітку" або "триколонну сітку". Я відчуваю, що це брудний трюк.

Чи є спосіб вирішити мою проблему чистим способом? Via .push-#, .pull-# або .offset-#?

Дякую тобі заздалегідь!

Нільс

Відповіді:

0 для відповіді № 1

Я знайшов відповісти одна вкладка далі на документах фонду Zurb.