any css after this code not working , what is the problem in this css code, only in firefox?

Footer css after form's css is not working , what is the problem in this css code?

/*------------------------------------*\
    FORMS */

fieldset { padding: 10px; border: 1px solid #ccc; margin-bottom: 1.5em; }
label { display: block; cursor: pointer; }
    label:after { content:\": "; }
    label::after { content:\": "; }
input,textarea { font-family: inherit; font-size: 1em; line-height: 1.5; }
[placeholder] { cursor: pointer; }
    [placeholder]:active,[placeholder]:focus { cursor: text; }
fieldset > :last-child { margin: 0; }


footer {background:red; height:200px; width:200px}

jSfiddle http://jsfiddle.net/Aw239/

in jsfiddle example footer should be red background开发者_运维技巧.

At least firefox Doesnt seem to understand this label:after { content:\": "; } i have no idea whats going on here but all i know is that it is the culprit. I've never actually used content properly.

But, remove those lines and everything runs smoothly.. ( OR reformat those two lines as Kyle showed and it should do it. )

Seems like it doesnt like to have closing semicolons in the same row with everything else

http://jsfiddle.net/Aw239/3/

Or.. get rid of the \'s ?

I formatted your CSS a bit and it seems to work in my FF5. http://jsfiddle.net/Aw239/2/

It is red. Are you using IE8? Because you'll need to use the HTML5 shim if you want to style HTML5 elements.

Does this work for you?