CSS "" vs " "?

Question

In CSS `.a > .b` is the same as `.a>.b`, but which of this two is the more correct notation? I see that in Chrome developer tools the 2nd variant is used

Accepted Answer

Neither is "more correct"; both are equally valid. The only thing that the spec says is that whitespace surrounding combinators is optional (emphasis mine):

Combinators are: whitespace, "greater-than sign" (U+003E, `>`), "plus sign" (U+002B, `+`) and "tilde" (U+007E, `~`). White space may appear between a combinator and the simple selectors around it. Only the characters "space" (U+0020), "tab" (U+0009), "line feed" (U+000A), "carriage return" (U+000D), and "form feed" (U+000C) can occur in whitespace. Other space-like characters, such as "em-space" (U+2003) and "ideographic space" (U+3000), are never part of whitespace.

Note that the descendant combinator itself is represented by a space character; if the only characters surrounding two compound selectors are whitespace characters then they are treated as a descendant combinator. In your example, the child combinator `>` can either be surrounded by whitespace, or not; there is no difference.

You can see an example of both whitespace and whitespace-less syntaxes in the spec itself, coincidentally also in the section describing the child combinator `>`. Notice, again with emphasis mine, that the spec even mentions explicitly where whitespace has been omitted, to demonstrate that it is in fact completely optional:

Examples:

The following selector represents a `p` element that is child of `body`:

```
body > p
```

The following example combines descendant combinators and child combinators.

```
div ol>li p
```

It represents a `p` element that is a descendant of an `li` element; the `li` element must be the child of an `ol` element; the `ol` element must be a descendant of a `div`. Notice that the optional white space around the ">" combinator has been left out.

As mentioned by others, when writing CSS, whitespace is good to have for readability purposes; if file size is a concern, consider minifying and/or compressing your stylesheet during post-production (minifying typically strips non-significant whitespace out for you, which can include whitespace around combinators). The only reason you would choose not to use whitespace when authoring CSS is a matter of coding style, and that is still technically valid, even if frowned upon.

CSS ">" vs " > "?

Solution

Problem