frameworks - Zurb's Foundation 3：更小的网格宽度

Question

一直在使用Zurb Foundation 3 框架。

我试图在 _settings.scss 中设置小于 1000px 的宽度，但出于某种原因，即使我输入的数字较小，它也只会下​​降到 770px。这是我所做的：

1. 执行指南针：compass watch projectname
2. 编辑_settings.scss：$rowWidth: 660px;

3. 将标记设置为：

   <div class="行">
           <div class="十二列">
               <h1>标题</h1>
               <p>这里有一些消息...</p>
           </div>
   </div>

Answer 1

这是我解决它的方法：

1. 创建了一个 _overrides.scss 文件：sass/_overrides.scss
2. 在 app.scss 中导入文件：@import "overrides";

3. 将此添加到 _overrides.scss 文件中：

   @media only screen and (min-width: $rowWidth) {
       。排 {
           最小宽度：$rowWidth；
       }
   }
   @media only screen and (max-width: 767px) {
       。排 {
           宽度：$行宽度；
           边距：0 自动；
       }
   }

4. 现在我可以_settings.scss通过更改 $rowWidth 来控制宽度，例如：$rowWidth: 660px;

只是一个小问题：如果 $columnGutter 小于 30px，如果屏幕尺寸小于 660px，则会出现水平滚动。