Question

I'm using Sass, Compass, and Susy 1 on a mobile first responsive web app. I need to provide IE6+ support alongside this.

I know that Susy One is supposed to work with IE6+ using Compass browser support variables. I've set up two stylesheets generated from scss files. In the IE specific stylesheet, the compass legacy support for IE variables are set to true, and in the normal stylesheet this is set to false.

The width values I'm getting in the compiled css all have % as their units. Is this the default for the IE backups? I was hoping to generate fixed widths (to avoid problems in < IE8).

The documentation on Susy One doesn't explain what the generated IE fallback css should look like. Am I missing something or worrying about nothing? Does anyone know of any examples that make use of the IE fallbacks?

Many thanks in advance.

Was it helpful?

Solution

If you are using "fluid" or "magic" layouts, then all internal widths will be output as "%". Older versions of IE handle that fine, though sometimes they have sub-pixel rounding issues. To solve that, Susy adds negative margins on the left side of "omega" elements. I've never seen any issues with that solution.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top