使用susy的網格大小

[英]Grid size using susy

我正在嘗試使用 susy 插件創建一個網格結構，但出於某種原因，我為它獲得了額外的空間。 我希望區域 div 正好為 1140 像素，當我使用屏幕截圖中附加的兩個額外網格空間進行測量時，它是 1140 像素。 我怎樣才能刪除那些？ 如果我從最右邊到最左邊測量，網格是 1140 像素，但如果我 ...

npm懷疑和咕unt我在做什么錯？

[英]What am I doing wrong with npm susy and grunt?

我試圖使用susy，node-sass，grunt-sass編譯我的scss文件，我使用npm install添加了所有這些依賴項。 我正在添加咕unt的設置 但這會引發錯誤 我該如何解決？ ...

如何使用NPM安裝Susy 2與Gulp一起使用

[英]How to install Susy 2 using npm for use with gulp

根據Susy 2.1.2文檔 ，安裝Susy就像運行npm install susy --save-dev然后按照上述文檔更改Gulpfile一樣簡單。 您可能會懷疑這會安裝2.1.2。 但是，此操作安裝了Susy3。與Susy 2相比，Susy 3引入了重大更改，這阻止了我客戶端的SA ...

Susy 2-調試圖像不正確-不是亞像素舍入問題

[英]Susy 2 - Debug image not correct - Not a sub-pixel rounding issue

看看這個Sassmeister，讓我知道最右邊那條深藍色的專欄是從哪里來的。 我不認為這是亞像素舍入的問題，但還有其他問題。 真正讓我困惑的是，選擇了12、13和14列時顯示的是多余的位，但是沒有顯示10、15或16列時顯示的是多余的位，盡管12列表示它是一個整數。 因此，無論結 ...

Susy與Google Web Starter Kit

[英]Susy with Google Web Starter Kit

想知道我哪里做錯了嗎？ 試圖讓Susy使用Google Web Starter Kit。 1.將GWSK 克隆到新目錄中。 2.Ran yarn安裝依賴。 3.安裝的Susy： yarn add susy --dev 4.添加到gulplfile： 5.在 ...

無法讓人懷疑地開始工作

[英]Can`t make susy start working

我想用Sass / Compass開始一個項目，對於網格我想使用susy。 已安裝sass -v 3.4.24 Compass 1.0.3 一切正常，工作正常。 安裝susy 3.0.6並無法正常工作后，我嘗試了2.2.12，並使用簡單的代碼body { @include contai ...

Susy-Sass，而不是SCSS

[英]Susy - sass, not SCSS

我正在嘗試使用sass和gulp開始使用Susy（網格系統）。 我已經導入了文件，但是只能找到Susy的SCSS文件。 有什么地方可以得到Susy的Sass版本的？ 霍坎 ...

根據可疑的列數對齊中心

[英]Align center depending on number of columns susy

我正在使用以下樣式使用susy對齊頁面中心的列： 但是默認情況下，它不會將元素（div）移動到頁面的中心，如果我有單個元素，它將其放在左側，但是我希望將該單個元素放置在頁面的中心。 元素動態增長，它們不是靜態的。 ...

SASS Susy和Flexbox用於在Susy Grid中垂直對齊LI

[英]SASS Susy and Flexbox for vertically aligned LI in Susy Grid

我已經查看了十幾個關於垂直對齊項目的各種堆棧問題以及一些網站，其中包含用於與SASS Susy對齊/協作的教程。 似乎我的用例是獨特的，我只是沒有技巧來解決它。 我有一個全寬容器，里面有一個包裝器。 容器使用susy span full，因為它只是站點容器的全寬度和flex包裝是實際內 ...

與嵌套的flexbox網格斗爭

[英]struggling with a nested flexbox grid

我試圖用基於負邊距的網格系統（susy）實現類似網格的模式並且失敗了。 我試圖使用flexbox，但我不確定它是否真的可能，我認為最好的方法是2列（A面和B面）並給盒子（1）50％的盒子2的彎曲高度，但它不知何故似乎沒有用。 這是我的工作。 .block { w ...

使用Susy的span功能嵌套嵌套裝訂線

[英]Nested split gutters using Susy's span functions

Susy是否有內置的方式使用span函數而不是mixin來解決具有裂溝的父母的孩子？ 這兒的孩子最終比預期的要短： 手動添加裝訂線— width: span(3 of 5) + gutter() —或更改裝訂線樣式— width: span(3 of 5 after) —都可以得到正確 ...

斷點 sass 未在 gulp 設置中加載，Susy 工作正常

[英]Breakpoint-sass not loading in gulp setup, Susy is working fine

嗨，我正在嘗試在我的 Gulp 設置中使用 susy 設置斷點 我已經運行 npm install breakpoint-sass --save-dev 並使用 @import "./node_modules/breakpoint-sass/stylesheets/breakpoint" 將它鏈接到 ...

Susy：在斷點處覆蓋bleed（）

[英]Susy: override bleed() at breakpoint

如何在較小的斷點處撤消bleed-x（）混合，因此示例2中的box4（黃色框）返回到紫色列之間，並且不換行到下一行。 Codepen： http ：//codepen.io/meijioro/pen/aBdWyO ...

Susy網格問題，涉及6個項目

[英]Susy Grid Issue with spanning 6 items

我在將我的12個項目跨越2行（共6行）時遇到一些問題。 我在“藝術家”部分遇到了問題。 我不確定是否應該為此使用畫廊混合，還是像其他部分一樣使用跨度。 http://codepen.io/anon/pen/pNjqzw HTML： SASS： ...

Susy Grid 2 / Grid Floats：如何使浮動元素的頂點與底部對齊？

[英]Susy Grid 2 / Grid Floats: How to verticle align bottom on a floated element?

可以說我有一個簡單的浮動網格，由可疑（或其他任何東西）制成。 如何使其中一列的內容停留在該列的底部？ 我嘗試了verticle-align ， align-items和其他組合，但是沒有運氣。 而且由於它是用浮子制成的，所以每當我在其上放上flexbox時，由於它們的圖標都浮在右邊，所 ...

Susy內有clearfix mixin嗎？

[英]Does Susy have a clearfix mixin within it?

我開始將Susy的Libsass版本與Gulp一起使用，並且可以在scss文件中看到提到了clearfix mixin / clearfix fallback mixin。 但是，如果我嘗試在我的sass樣式中引用此內容，則通過gulp進行編譯會返回錯誤： 誰能告訴我是否可疑的cl ...

如何使用Susy網格創建'bootstrap'樣式網格？

[英]How to use Susy grids to create a 'bootstrap' style grid?

我喜歡Bootstrap使用填充的方式，然后對'row'進行負邊距以使所有內容都符合要求。 當試圖去除某些東西上的排水溝時，它消除了對:nth-child選擇器的需求。 但我喜歡在地圖中指定排水溝的能力，並將它們設置為百分比。 我有點設法做到這一點，但它感覺笨拙，並想知道是否有更好的方 ...

Susy網格塊無法正常流動

[英]Susy Grid block not flowing properly

我正在使用susy創建一個非常基本的博客布局，其3列寬用於大中型屏幕，2列寬用於小屏幕（平板），然后1列用於移動。 您可以在此處看到手機和平板電腦的布局正常，但中型和大型屏幕無法正常顯示，第一行和第三行的第一列未正確浮動 以下是我的scss： 我的scss樣式表頂部的可疑地圖是： ...

超越裝訂線寬度Susy 2

[英]Override gutter width Susy 2

我試圖覆蓋Susy 2中的裝訂線寬度，但無法使其按要求工作。 我為網站設置的標准如下。 我有一個圖片庫，我希望塊之間的間距要小得多。 我可以使用（gutter-override：0.1）覆蓋裝訂線寬度，但這不會影響塊的寬度。 塊的寬度仍然像裝訂線是0.5。 是否可以更改某個內 ...

將嵌套元素的寬度設置為列寬

[英]setting nested element width to column width

我在尋找解決該問題的正確方法時遇到了一些麻煩： 我遇到以下情況： 現在在12列網格中，我將.section定義為： 到目前為止，一切都很好。 現在，我已將.title定義為將圖像懸停在以下位置： [編輯]我正在使用的配置具有以下定義： 但我不能使用widt ...