整潔2.0 - 將網格大小設置爲全角px

我目前已經開始嘗試新的Neat 2.0 framework。以前在1.8創建網格時，outer-container() mixin接受了網格大小的實際數字。但是現在使用Sass映射時，grid-container() mixin只接受具有以下屬性的sass映射。整潔2.0 - 將網格大小設置爲全角px

$my-custom-grid: (
    columns: 12, 
    gutter: 20px, 
    media: 1200px, 
    color: rgba(#00d4ff, 0.25), 
    direction: ltr, 
);

從它看起來，這只是使網格默認全屏幕的寬度。如何製作只有960像素寬的網格，但在開始縮小瀏覽器尺寸時仍會摺疊？

我覺得現在我會不斷移動元素，使他們不在瀏覽器邊緣。我敢肯定，有一種解決方法，但只是設置元素的寬度，我打電話grid-container()不起作用。

有什麼想法？

來源

2017-05-18 Nathan Hulsey

您是否在'grid-container（）'類中使用'max-width：960px;'嘗試過？ – tec4

哈哈是的，我確實和解決了這個問題。我不確定這是否會與網格系統混淆，但由於所有列寬都使用'calc（）'，所以現在它沒有引起任何問題。謝謝你的回覆！ @ tec4 –

CSS max-width就是答案！它不會設置容器的寬度，而是避免容器超過給定的值。這樣width: calc()仍然會按預期工作。

來源

2017-05-24 17:35:03 tec4

我可以證實這確實是答案！哈哈謝謝你！ –

您可以接受此答案，以便其他用戶可以立即知道答案是什麼。 @NathanHulsey – tec4

整潔2.0 - 將網格大小設置爲全角px

回答

相關問題