susy-compass

问题 I currently have a 3 tabbed page. Each tab is a div that is set to display: hidden when not selected. In these tabs I have a Grid system created with Susy (compass plugin). Also each tab page has a set of Highcharts. When I load the page, depending on which tab is in the URl, one of the tabs is loaded. All of the charts look fine, however when I switch to a different tab, some of the charts are not fitting correctly in their div. If I just re-size the window, the charts are recalculated and

问题 I'm trying to build a 12 column grid with fluid columns and fixed gutters. Columns would change width as the window resizes, but the gutters would remain constant. Basically, percentage for columns, ems for gutters. Is this possible with Susy? 回答1: You could use the padding as your gutter and would allow you to have a fixed "spacing" while keeping the fluid nature of the grid. This would however force you to add extra markup if you need backgrounds that doesnt extend to the "gutter" area. 来源：

问题 I am working on my website and I want to use Susy as well as Compass. I am using Grunt too. When I run my grunt task I get this error: Denniss-MacBook-Pro:portfolio dennis$ grunt --trace Running "compass:dev" (compass) task Gem::LoadError on line ["1990"] of /System/Library/Frameworks/Ruby.framework/Versions/2.0/usr/lib/ruby/2.0.0/rubygems/specification.rb: Unable to activate susy-2.1.1, because sass-3.2.17 conflicts with sass (~> 3.3.0) Run with --trace to see the full backtrace Warning: ↑

问题 I've successfully used the beautiful Susy grid system to create a responsive layout similiar to the one of WebDesignerWall.com: What i failed to implement is a position:fixed sidebar. Such a sidebar would not scroll when the page is scrolled and stays on the same place. That's fantastically convenient (anyway, you actually can't put more content into the sidebar, because it would clutter the top of page in a narrow window). My layout goes crazy whenever i apply position:fixed to a column: The

问题 i've started a project with compass 0.12 and sass 1 and susy 1.0.9.Now i want to resume it and i done an upgrade for gems.So i have now newers versions for compass (1.0.1), sass (3.4.0, 3.2.12) ans susy (2.1.3). So i found a fix to use old syntax for susy 1, @import "susyone"; but i still get errors for compass: (Line 280 of /var/lib/gems/1.9.1/gems/compass-core-1.0.1/stylesheets/compass/_support.scss: List index is 2 but list is only 1 item long for `nth') This nth is used for an additional

问题 This is certainly easiest to show with some code: .container{ .gallery { ul { @include clearfix; } li { @include span-columns(1,4); &:nth-child(4n) { @include omega; } } } @include at-breakpoint($large-columns) { .gallery { li { @include span-columns(1,3); &:nth-child(4n) { @include remove-omega; } &:nth-child(3n) { @include omega; } } } } } I'm starting out with 4 columns with the 4th being omega, then I want to change over to 3 columns, with the 3rd being omega. The correct elements are

问题 Te error: css/chpw.scss (Line 13: Mixin "at-breakpoint" does not accept a content block.) The scss: @import "compass"; @import "compass/reset"; @import "susy"; @include at-breakpoint(30em 12) { .page { @include container; } } No matter what I try at-breakpoint keeps breaking. Using ruby-2.0.0-p0 and compass-susy-plugin (0.9) susy (1.0.8). 回答1: I had this same problem on Windows 7. Eric Meyer's answer is correct. Typing gem uninstall compass-susy-plugin at the command line solved the problem.

问题 Using Susy 2 (release candidate), I'm trying to figure out how to create a simple fluid layout with a fixed width sidebar - either left position or right - I'm happy using the first and last keywords. Can anyone give me any pointers on how to do this within Susy 2? Thank you! 回答1: There are a few ways to mix fixed/fluid layouts, depending on your own specific case. Isolate the sidebar. Float isolation is a cool a way of keeping floats independent from each other. .side { @include span(3

问题 I have an issue where susy grids doesn't seem to be applying fixed widths to inner columns. Here is my issue http://sassmeister.com/gist/7633527 What I was expecting is that when I have $container-style: static that any inner columns widths would get pixel widths but they don't. If $container-style: fluid is set then percentage widths would be applied. Am I misunderstanding something about how $container-style works? Any pointers would be appreciated. 回答1: You're right, but in this case you

问题 In Ruby, you can easily pass a variable from inside a method into the attached code block: def mymethod (1..10).each { |e| yield(e * 10) } # Passes a number to associated block end mymethod { |i| puts "Here comes #{i}" } # Outputs the number received from the method I would like to do the same thing in SASS mixin: =my-mixin @for $i from 1 to 8 .grid-#{$i} @content +my-mixin color: nth("red green blue orange yellow brown black purple", $i) This code won't work because $i is declared inside the