Lobotomized Owl Selector

The Lobotomized Owl selector is one of the most powerful but underused selectors in CSS. It was introduced quite recently by Adjacent Pickering in June 2014.

The characters used for the selector resemble a blank stare of the owl and hence it’s name. It is represented as


The plus sign is the Adjacent sibling selector which refers to any term or element that is positioned next to it. I have written a blog post quite recently on that.

Let’s try to dissect each part of the selector and analyze what it means. As we know the browser reads CSS from right to left. So let’s begin that way. The first term that we come across is the ‘*’ . The ‘*’ itself is a selector in it’s own capacity. It is quite commonly known as the Universal Selector. It can basically select everything in the CSS domain which includes classes , Id’s etc.  The next element is the plus sign which we discussed a little while ago, the Adjacent sibling selector. And the last term is again the Universal Selector.

Now let’s combine all of them an see what it means. So once you join them, or would be something like this  ‘Everything before Everything’. This basically means that it can be used or applied anywhere in the CSS stylesheet since it has got an infinite domain.

Hopefully by now you have got a broad understanding of what it means.


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s