Question

I am getting compiling errors in all my CSS files at the line of “filter: progid: DXImageTransform.Microsoft.gradient”. Here is an example of my CSS and the error I get on Eclipse for this GWT project. Can you see why?

Error:

Invoking generator com.google.gwt.resources.rebind.context.InlineClientBundleGenerator
               Preparing method style
                  The following problems were detected
                     [WARN] Line 25 column 9: encountered ":". Was expecting one of: "}" "+" "-" "," ";" "/" <STRING> <IDENT> <NUMBER> <URL> <PERCENTAGE> <PT> <MM> <CM> <PC> <IN> <PX> <EMS> <EXS> <DEG> <RAD> <GRAD> <MS> <SECOND> <HZ> <KHZ> <DIMEN> <HASH> <IMPORTANT_SYM> <UNICODERANGE> <FUNCTION> 
                     [WARN] Line 139 column 17: encountered ":". Was expecting one of: "}" "+" "-" "," ";" "/" <STRING> <IDENT> <NUMBER> <URL> <PERCENTAGE> <PT> <MM> <CM> <PC> <IN> <PX> <EMS> <EXS> <DEG> <RAD> <GRAD> <MS> <SECOND> <HZ> <KHZ> <DIMEN> <HASH> <IMPORTANT_SYM> <UNICODERANGE> <FUNCTION>

CSS file:

.header {
    position:absolute;
    top:0px;
    heigth:40px;
    width:100%;

    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 1px 2px rgba(0,0,0,.2);

    background: #0a0809; /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,allthestuffhere==);
    background: -moz-linear-gradient(top,  #0a0809 0%, #0a0e0a 43%, #292b28 100%, #aebcbf 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0a0809), color-stop(43%,#0a0e0a), color-stop(100%,#292b28), color-stop(100%,#aebcbf)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #0a0809 0%,#0a0e0a 43%,#292b28 100%,#aebcbf 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #0a0809 0%,#0a0e0a 43%,#292b28 100%,#aebcbf 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #0a0809 0%,#0a0e0a 43%,#292b28 100%,#aebcbf 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #0a0809 0%,#0a0e0a 43%,#292b28 100%,#aebcbf 100%); /* W3C */
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#0a0809', endColorstr='#aebcbf',GradientType=0 ); /* IE6-8 */
}

Answer 1

It should be:

filter: progid \:DXImageTransform \.Microsoft \.gradient(startColorstr \='#0a0809', endColorstr \='#aebcbf',GradientType \=0 ); /* IE6-8 */