Get a CSS Killswitch Effect With Only One Line of Code

I recently came across a site on Twitter called CSS Killswitch. What is it exactly? According to their site: “CSS Killswitch lets you non-destructively black out a difficult client’s website with the click of a button.”

The Code

If you try out their “two second demo” you’ll see all it basically does it make your page go completely blank. You can accomplish pretty much the same thing by placing the following bit of CSS code in your stylesheet.

* { display: none; }

If you notice anything still visible, you probably have some !important things you need to take care of as well.

Explanation

• The asterisk selector (*) acts as a wildcard, and selects all elements within the page.
• The “display: none” means nothing will be displayed on that selector.
• Combined with the asterisk selector, effectively everything on the page is not displayed.

Downside

If your client knows anything about CSS, they’ll probably be able to easily identify this line of code and remove it. You can try to be creative with it and put it somewhere a client will not be likely to look.

According to the CSS Killswitch website, removing their method of hiding the page is as easy as identifying the offending CSS link and removing it.

Thoughts

I guess this is all done under the assumption that your clients are not aware of basic CSS techniques and therefore will be dumbfounded enough into finally paying you (the designer) for your work.

This might be useful if a client refuses to pay for work, but I’d only recommend using something like this as an absolute last resort.

Conclusion

Yeah, I know you CSS experts reading are probably already well aware of the asterisk selector and display: none. For everyone else, would you be interested in more if these quick CSS tip posts?

I’d be interested to hear your thoughts on more CSS tip posts, and the premise behind these methods of “disabling” pages for non-paying clients. What about the legality and ethics of doing such a thing?

Sound off in the comments.

Related posts:

1. Dipslaying Code In WordPress Posts
2. The Easy Way To Display Recent Posts in WordPress
3. The Ultimate Guide to the WordPress Loop