3

What does the css selector * + * actually mean? You can see it it in google chrome's console when you do an inspect element. According to me it seems like applying a style to "Every second child" , but still want to be sure. Can anyone help me out?

Example:

*+* {
   margin-top:1em;
}
raina77ow
  • 99,006
  • 14
  • 190
  • 222
pogbamessi
  • 279
  • 2
  • 16
  • possible duplicate of [What is the logic behind sibling selectors * + * and * ~ *?](http://stackoverflow.com/questions/16695556/what-is-the-logic-behind-sibling-selectors-and) – BoltClock May 01 '15 at 15:43

4 Answers4

8

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

raina77ow
  • 99,006
  • 14
  • 190
  • 222
5

plus sign (+) means, if the second selectors directly is a sibling to the first selector:

h1+h2 {margin: 1em;}

h2 {margin: 2em;}

all h2 have 2em margin, except the one that directly follows a h1, that one has 1em margin.

hopes that will make it clear for you

Mark
  • 6,545
  • 1
  • 30
  • 49
1

As Specified in W3C documentation it represents the "Adjacent Sibling Combinator".

div + p

Selects all <p> elements that are placed immediately after <div> elements

Ranjith
  • 124
  • 4
0

Same as *:not(:first-child) but is shorter. I would prefer to write it out the long way as I think it's more readable, but I can see why a minifier would prefer *+*

Dustin Poissant
  • 2,893
  • 1
  • 18
  • 26