squaredesign
we turn great ideas into excellent websites

toggling CSS rules

somewhere in my development career, i observed a quick way of enabling and disabling blocks of code using comments. i use this now in all my stylesheets, to be able to quickly toggle a CSS selector on and off.

if you look at a block comment:

/* */

you realize you can stack two of these up on each other:

/* */ i'm not commented!  /* */

and by quickly inserting a space in the closing side of the first comment, you can make the comment tag expand to encompass the whole line or block.

/* * / <-- that space makes me commented now!  /* */

the finished example:

/* no space */ #example{} /* enabled */
/* with space * / #example{} /* disabled */

you can use this to toggle a debug class, e.g.

/*  */  .todo { font-weight:bold; color:red; } /* */
w
Q