0

What does the CSS selector .class > * + * {} do? I'm puzzled by * + * in particular.

Ramiro Manuel Estevez
  • 9
  • 2
  • 2
    That's the [Lobotomized Owl](https://alistapart.com/article/axiomatic-css-and-lobotomized-owls/) selector. – zzzzBov Mar 26 '21 at 18:08

2 Answers2

1

* + * means 'any element that has a previous sibling' - in other words, is not a first child.

You can refer to this question link: CSS selector + definition

Dharman
  • 30,962
  • 25
  • 85
  • 135
Manoj Boganadham
  • 21
  • 2
  • Even better SO question [here](https://stackoverflow.com/questions/16695556/what-is-the-logic-behind-sibling-selectors-and). – Daweed Mar 26 '21 at 18:17
-1

.class will select specific class

.class > * will select all elements with specified class

.class > * + * will select all first element of elements that will be children of .class

For Example

<div class="class">
  <span>
    <h1></h1>
    <p></p>
  </span>
  <span>
    <h1></h1>
    <p></p>
  </span>
  <span>
    <h1></h1>
    <p></p>
  </span>
</div>

This will select all tags except first span and its elements

Navid Anjum
  • 92
  • 7
  • 2
    This is wrong. `.class > *` will select **every** direct child - in your example, the `span` tags. And `.class > * + *` will select every element **except** for the first. In your case, the first `span` will not be selected. In your example no `h1` tags would be selected. https://jsfiddle.net/sgurp9n1/ – disinfor Mar 26 '21 at 18:31
  • .class > * + *{ background-color: green; color: green; } just use this and remove other css you use and you will understand . Except first every tag are selecting – Navid Anjum Mar 26 '21 at 18:54
  • _This will select all tags except first span and its elements_ This is still wrong. Your second rule `.class > *` is selecting and applying to the first `span` element. It's your third rule `.class > * + *` that is styling all `span` except the first. My first comment is partially irrelevant now, since you edited the original text. – disinfor Mar 26 '21 at 18:58