CODEWITHSUNDEEP
csssasscompass-sasssusy-compass
Allan
Allan

Reputation: 155

Susy Compass omega is adding #margin-left: -1em;

I am using the Susy framework to create a grid for my website and am really liking it. I can't figure out why #margin-left: -1em is being added when I use omega in span columns. I cannot seem to find any information about it and it throws this error when I validate the css: .second Parse Error #margin-left: -1em;

My code looks like the below

//this is the default number of columns
$total-columns: 12; 
//width of each column
$column-width   : 4em; 
//space between columns
$gutter-width   : 1em; 
//space on the right and left of the grid
$grid-padding   : $gutter-width;

.first{
    @include span-columns(6,12);
}
.second{
    @include span-columns(6 omega,12);
}

and generates this

.first {
   width: 49.15254%;
   float: left;
   margin-right: 1.69492%;
   display: inline;
}

.second {
   width: 49.15254%;
   float: right;
   margin-right: 0;
   #margin-left: -1em;
   display: inline;
 }

Upvotes: 0

Views: 407

Answers (1)

Andrey Mikhaylov - lolmaus
Andrey Mikhaylov - lolmaus

Reputation: 23873

Your code compiles fine for me with Compass. The line in question has an asterisk, not a hashmark:

*margin-left: -1em;

A line of CSS that starts with asterisk is a hack that works only for IE <= 7.

To disable IE 6-7 support, set $legacy-support-for-ie to false prior to importing Susy:

$legacy-support-for-ie: false;
@import "susy";

Upvotes: 3

Related Questions