Question

使用Foundation 6，我在large-3 column左侧有一个large-9 column。这很好，除非在某些情况下large-3 column可能不存在。在这种情况下，我希望剩余的列填充整个行，即表现得好像是large-12列。我觉得这种事情应该由基金会以某种方式本地支持，但在文档中看不到任何关于它的内容，并且我不知道如何手动实现它。

Answer 1

TL：DR; - 基金会不支持此功能，但我已经阅读了您的问题并且有一些可能的解决方案：

什么控制large-3 columns的存在？如果是通过某种脚本/查询（PHP / Python），你可以回应相关的div。例如：

if (some_condition === true) {
    echo '<div class="large-3 columns">...</div>';
    echo '<div class="large-9 columns">...</div>';
} else {
    echo '<div class="large-12 columns">...</div>';
}

如果您需要以某些分辨率隐藏它，您可以使用网格的内置功能：

<div class="row">
  <div class="large-3 show-for-large columns"><!-- ... --></div>
  <div class="large-9 medium-12 columns"><!-- ... --></div>
</div>

您可以通过jQuery的remove()方法删除/添加div：
```
$( ".large-3" ).remove();
```

我希望它有所帮助。无论如何，随意添加代码，以便我们可以提供更多帮助。

如果没有其他列，则使宽度为9的列填满整个宽度

1 个答案: