How to test CSS rules with Firebug

Posted on by John

This is a quick screen cast on how to test live css rule with firebug before committing your changes to yours stylesheet. This is quite a time saver!

  • Jaysone

    I voted for you..nice tutorial..anyway..i have a question..sorry if it’s stupid..How do you copy the whole stylesheet (the one you made changes in firebug)?

    • http://johndturner.com John Turner

      With styles on the right, you can only copy one rule at a time, because the rules could be from different stylesheets. To copy the entire stylesheet click the CSS tab in firebug and select your stylesheet. See this screenshoot: http://www.flickr.com/photos/johnturner/3986456747/

  • Elby

    How do I do the last step – copy the updated style rule?

    Thanks,
    Elby

    • http://johndturner.com John Turner

      With styles on the right, you can only copy one rule at a time, because the rules could be from different stylesheets. To copy the entire stylesheet click the CSS tab in firebug and select your stylesheet. See this screenshoot: http://www.flickr.com/photos/johnturner/3986456747/