CODEWITHSUNDEEP
csssassresponsive-designcompass-sasssusy-compass
poseid
poseid

Reputation: 7156

What does @include container mean?

I am getting started with Compass and Susy. My goal is to make my layout adapt to phone, tablet, and desktop screen sizes. In the Susy examples (susy.oddbird.net or SO question), there is a pattern of having the number of columns adapt to the screen size. Specifically, there are nested rules like these:

.container {
  @include container;

  @include desktop {
    @include container;
  }
}

My questions now: What does the container { @include container } do? And, why is it nested again in the desktop include?

Upvotes: 2

Views: 6853

Answers (1)

Miriam Suzanne
Miriam Suzanne

Reputation: 14010

The container mixin establishes the width of your page. You only need to repeat it at different breakpoints if that width should change (as they would with adaptive layouts). If you are using a fluid grid, there is no need for the repetition.

Upvotes: 3

Related Questions