Re: @import -- allow at any place in stylesheet.

17.01.2012, 20:14, "Tab Atkins Jr." <jackalmage@gmail.com>:
> On Mon, Jan 16, 2012 at 7:36 AM, Marat Tanalin | tanalin.com
> <mtanalin@yandex.ru> wrote:
>
>> šHello. It makes sense to allow @import at any place in CSS stylesheet.
>>
>> šFor example, if we have:
>>
>> šš š.rule-before-example {...}
>> šš š.example {...}
>> šš š.rule-after-example {...}
>>
>> šWe could have same expressed with @import:
>>
>> šš š@import "before-example.css";
>> šš š.example {...}
>> šš š@import "after-example.css";
>>
>> šwhere "after-example.css" contains:
>>
>> šš š.rule-after-example {...}
>>
>> š(Real-world imported stylesheets are, of course, much larger.)
>>
>> šSo why should @import be disallowed here for importing "after-example.css"? This just makes development less usable/flexible.
>
> What does this help with?
>
> The restriction that @import has to appear at the top of a file is
> meant, I believe, to make it easier to understand that other files are
> being imported. šA lone @import in the middle of a file is easy to
> accidentally skip over for a human.

It's wrong and harmful to try think for web-developers and invent artificial unusable limitations as a result. Web-developers themselves are capable to decide how to use syntax. Imports/includes in PHP, SSI, etc., are possible at any place, and this is not an issue there.

@imports could be allowed at least exactly at the end of stylesheet. Currently, to achieve same result, we are often forced to make order of including less logical. For example, we have main.css linked to HTML document, and override.css imported to main.css. We want that rules from override.css would override main.css rules with same specificity. For this purpose, rules from override.css have to appear in cascade _after_ rules from main.css. We could do this usable way:

    <link rel="stylesheet" href="main.css" />

    main.css:
        /* ...
           Some rules to be overridden.
           ... */
        @import "override.css";

But currently we are forced to link to override.css instead of main.css to HTML document, and import main.css at the beginning of override.css:


    <link rel="stylesheet" href="override.css" />

    override.css:
        @import "main.css";
        /* ...
           Some rules that override rules from main.css.
           ... */

All that just decreases flexibility.

> Note that if you really want to interleave some imported code, you can
> do so by just using *more* imports, like:
>
> ---top of file---
> @import "before-example.css";
> @import "example.css";
> @import "after-example.css";

This forces web developer to create one more file just because of syntax lack.

Received on Tuesday, 17 January 2012 17:17:28 UTC