Questions tagged [susy]

Susy is a (now deprecated) design-agnostic set of tools for creating powerful, custom layouts.

Web:
Susy was a responsive layout engine for Sass, before flexbox and CSS grid were available. Susy is now deprecated, and will not receive updates. If you need help moving off Susy, or learning the latest in web layout, we offer training and consulting to help bring you up-to-date.

Github:
Susy is a design-agnostic set of tools for creating powerful, custom layouts. We didn't want another grid system full of rules and restrictions — we wanted a power tool for building our own damn systems. Version Three is trimmed down to it's most basic components — functions that can be used to build any grid system.

Susy is Deprecated. It should no longer be used on new projects, and will no longer be receiving any updates.

Web: www.oddbird.net/susy/
Github: https://github.com/oddbird/susy

207 questions
0
votes
3 answers

DEPRECATION WARNING: Passing null, a non-string value, to unquote()

I am running Sass, Compass, and Susy. I upgraded to the latest versions: bigdecimal (1.2.4) chunky_png (1.3.3) compass (1.0.3) compass-core (1.0.3) compass-import-once (1.0.5) ffi (1.9.6 x86-mingw32) io-console (0.4.2) json (1.8.1) minitest…
SBel
  • 3,315
  • 6
  • 29
  • 47
0
votes
1 answer

Susy grid background

I have these styles: +with-layout(8 1/4) .fact-circle-container +container(show) +clearfix font-size: 4px padding: 0 30px li +gallery(2) My grid items line up correctly. In this case each
  • spans two of the 8 columns…
  • rctneil
    • 7,016
    • 10
    • 40
    • 83
    0
    votes
    1 answer

    Layout order which differs from markup order with Susy

    Is it possible to use Susy to create a layout with an order which differs from the order in the markup? My markup is similar to:
    This…
    Andrew
    • 153
    • 1
    • 11
    0
    votes
    1 answer

    Susy 2.1.3 issue regarding layout change on breakpoint

    Help me out you sassy susy's, I am at my breaking point! I am trying to make the most efficient layout for my project, and I have come across something I havn't been able to figure out with Susy/breakpoint. I want the layout columns to change at…
    worlddev
    • 52
    • 1
    • 8
    0
    votes
    1 answer

    Heretic order/disposition on a 3 columns grid

    I want to make a simple 3 columns / 3 rows grid with Susy 2 like : 1 2 3 4 5 6 7 8 9 But the blocks are floating in a buggy and heretic order. You can have a look : http://img.spheerys.fr/images/2015/01/05/bug-susy.jpg Here my HTML…
    Hedy
    • 143
    • 1
    • 7
    0
    votes
    1 answer

    How do you set a custom susy layout's gutters to 0?

    I'm finding myself frequently having to negate gutters with margin-left: 0; margin-right: 0;. I tried setting gutters in a custom layout to 0 $my_layout: (gutters: 0); .my_class { @include with-layout($my_layout) { ... } } but this does not…
    hal
    • 4,845
    • 7
    • 34
    • 57
    0
    votes
    0 answers

    Using susy in Rails 4.1.1

    I am using Rails 4.1.1. And want to use sass and susy. With help of the following releated item: https://stackoverflow.com/a/26171101/2118999 I have created the following files directory: app/assets/stylesheets/ _base.css.scss …
    MDekker
    • 443
    • 1
    • 4
    • 19
    0
    votes
    1 answer

    Susy reusable responsive columns

    I'm trying to wrap my head around Susy. I think I'm going to like it. Just need to work with it more. I'm basically trying to create reusable columns that I can use throughout a site. I'm coming from using the Foundation grid, so maybe I'm not…
    MAZUMA
    • 913
    • 3
    • 10
    • 20
    0
    votes
    1 answer

    Adding divider between horizontal sass susy grid

    I'm trying to figure out how to add vertical dividers between my horizontal layout. I have 3 columns and I'd like dividers to the right and left of the middle column. Typically I would add an :after rule in CSS to draw it after each element and a…
    Glitches
    • 742
    • 2
    • 8
    • 18
    0
    votes
    1 answer

    Susy gallery breaks height for display table and table-cell

    I'm trying to get equal height columns on my responsive grid using the gallery mixin for SUSY. To do that, I set the container "display: table" and the column "display: table-cell". This works for me if I do not use the mixin, but fails as soon as I…
    Tom Stermitz
    • 182
    • 1
    • 2
    • 8
    0
    votes
    1 answer

    Susy grid alignment a bit off

    Learning Susy, lovin' it. Having a few quirks while testing simple things though. I'm trying to create two half width columns side by side with some gutter space in-between and a full width column after it. The problem is the second half width…
    totalnoob
    • 2,521
    • 8
    • 35
    • 69
    0
    votes
    1 answer

    Cannot load such file - Ruby / Compass / Susy

    When I run grunt, I keep getting the following error. I've installed, uninstalled, reinstalled them multiple times with the same issue. On a previous PC with the same installation files it worked fine, so I'm confused as to what is causing the…
    otajon
    • 3
    • 4
    0
    votes
    0 answers

    Susy Error: WARNING: Static math requires a valid column-width setting

    I continue to get this error in my terminal. Error: WARNING: Static math requires a valid column-width setting I am currently using gulp and gulp-sass for my app. This is my main.scss file, and I can't seem to figure out how to satisfy this error.…
    chris_s
    • 1,051
    • 4
    • 14
    • 28
    0
    votes
    1 answer

    Changing Gutters only for a section using susy

    I'm building a site with susy to allow flexibility with the grids I need, I have not set any settings at the moment so Im only using the defaults. I want to be able to change the gutters (make them smaller) for a section of the site. I built it out…
    Iamsamstimpson
    • 1,359
    • 2
    • 17
    • 32
    0
    votes
    1 answer

    Susy gallery with AngularJS (ng-repeat) - not filling gaps from ng-hide

    I'm using Susy's gallery tool to display elements in a grid format. Angular is hiding or showing those grid elements on the fly, depending on user selections. When Angular hides an element in the grid, it attaches a class of ng-hide to it. This in…
    Fisu
    • 3,294
    • 9
    • 39
    • 61