Zurb Foundation small-push 也适用于大

Question

我正在使用 zurb 基础并添加 small-push-1 但它也会影响大面板尺寸。

这是我的 div 结构：

<div class="expertise-panel large-5 medium-5 small-push-1 small-10 columns">
</div>

有人遇到过同样的问题吗？

Answer 1

据我所知，您正在尝试使小列居中。我认为您应该使用centered classes，而不是使用small-push-1。

这将导致如下结果：

<div class="expertise-panel small-10 small-centered medium-5 medium-uncentered columns">
</div>

另一种选择是使用offset classes，在这种情况下，您应该将“small-offset-1”和“medium-offset-0”添加到类属性中。

请注意，您会自动“继承”较小类的样式。不必写 'large-5 medium-5'，因为 medium-5 和 large-5 都指定了 41.66667% 的宽度。所以如果不添加 large-5 类，就会使用 medium-width 类。

这种行为也适用于中等不居中的阶级。因为我在专家面板中添加了 medium-uncentered，所以 large/xlarge/xxlarge 也会自动变为 uncentered。