sass nested reset with import

Question

My goal is to reset all elements in #wrapper div.

How can I do it in SASS ?

Idea:

#wrapper {

    @import url(http://reset5.googlecode.com/hg/reset.min.css);  

}

Answer 1

Here's how an import looks in Sass:

@import "_reset";

The file can be either .scss, .sass or .css. It must be on your local file system; the @import must point to a location relative to the file you are using it in. The underscore is a partial, which means that it will only be included in other files, and won't output its own reset.css file.

You'll probably find it easiest to save a local copy of that reset file. Consider making changes to your reset copy - there's little sense to resetting #wrapper body.

Also note that if you want to affect just #wrapper, you'll do this:

#wrapper {
    @import "_reset";
}

But if you want to affect everything inside #wrapper, you'll do this:

#wrapper * {
    @import "_reset";
}