CSS calc support

[Jan Badenhorst]

Hi all,

I would like to use the new css calc functionality (http://updates.html5rocks.com/2012/03/CSS-layout-gets-smarter-with-calc) with closure stylesheets.

At the moment we only use closure-stylesheets to minify our CSS, so I sadly can't bring the full power of gcc funcitonality onto this.

In the meantime I want to use the css calc capability and have the following code:

.my-calc-problem {
    /* @alternate */ height: -moz-calc(100% - 30px);
    /* @alternate */ height: -webkit-calc(100% - 30px);
    /* @alternate */ height: -o-calc(100% - 30px);
    /* @alternate */ height: calc(100% - 30px); 
}

This works fine in un-minified mode, however, the compiler does not like it in that it throws:

Parse error in ../../media/css/global_defaults.css at line 100 column 46:
    /* @alternate */ height: -moz-calc(100% + 30px);
                                             ^
com.google.common.css.compiler.ast.GssParserException: Parse error in ../../media/css/global_defaults.css at line 100 column 46:
    /* @alternate */ height: -moz-calc(100% + 30px);
                                             ^
at com.google.common.css.compiler.ast.GssParserCC.parse(GssParserCC.java:175)
at com.google.common.css.compiler.ast.GssParser.parse(GssParser.java:46)
at com.google.common.css.compiler.commandline.DefaultCommandLineCompiler.parseAndPrint(DefaultCommandLineCompiler.java:104)
at com.google.common.css.compiler.commandline.DefaultCommandLineCompiler.compile(DefaultCommandLineCompiler.java:94)
at com.google.common.css.compiler.commandline.DefaultCommandLineCompiler.execute(DefaultCommandLineCompiler.java:129)
at com.google.common.css.compiler.commandline.ClosureCommandLineCompiler.executeJob(ClosureCommandLineCompiler.java:285)
at com.google.common.css.compiler.commandline.ClosureCommandLineCompiler.main(ClosureCommandLineCompiler.java:351)
Caused by: com.google.common.css.compiler.ast.ParseException: Encountered " <S> "  "" at line 100, column 46.
Was expecting:
    <NUMBER> ...

Now this looks to me as if the problem is not with the -moz-calc function name, but rather the syntax in the calculation itself. Is there something I am doing wrong, or is this simply not supported in the compiler (yet) ?

regards

Jan

 

[Jan Badenhorst]

That was meant to read "...can't bring the full power of gss functionality onto this." 

[regard...@gmail.com]

Still no reply? Wow... I think they have put too much 'smart ass' into it, I use it only because it can minify the css class names, but having to wait for months to be in sync with the browser capabilities is putting me off.