Zurb的基金會3：較小的網格寬度

Question

已與Zurb Foundation 3 framework一起使用。

我想在_settings.scss中設置寬度小於1000px的寬度，但對於som原因，即使我放入較小的數字，它也只能降至770px。下面是我所做的：

1. 執行的指南針：compass watch projectname
2. 編輯_settings.scss：$rowWidth: 660px;

3. 設置標記來：

   <div class="row"> 
        <div class="twelve columns"> 
         <h1>Heading</h1> 
         <p>Some message here ...</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) { 
       .row { 
        min-width: $rowWidth; 
       } 
   } 
   @media only screen and (max-width: 767px) { 
       .row { 
        width: $rowWidth; 
        margin:0 auto; 
       } 
   }

4. 現在我可以控制_settings.scss寬度通過改變$ rowWidth，例如：$rowWidth: 660px;

只是一個小問題：如果$ columnGutter爲t少han 30px如果屏幕尺寸小於660像素，則會出現水平滾動。