整洁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

回答

相关问题