I found another bug with the Tidy button in the stack snippets.
(By the way, my earlier bug report still hasn't been resolved.)
This one is about the CSS.
If one of the parts of a selector starts with a colon, the "Tidy" button removes the whitespace before it.
Example:
tr :first-child {
background: yellow;
}
<table>
<tr><th>h1</th><th>h2</th><th>h3</th></tr>
<tr><td>a1</td><td>a2</td><td>a3</td></tr>
<tr><td>b1</td><td>b2</td><td>b3</td></tr>
</table>
Hitting Tidy will change the css selector to tr:first-child
, which is not the same! In this case, it selects the table's first row instead of the first column.
Steps to reproduce: Copy snippet to answer, edit the above snippet, click "Run", see the result. Now click "Tidy" and then "Run" again. See the difference!
So, can this be corrected?
Edit:
To address the comments to the (deleted) answer: yes, these are different selectors! xx:yy
means pseudo-class yy
on element xx
, while xx :yy
with a space means pseudo-class yy
on any child element of element xx
. This is the official definition, and it doesn't need *
to be correct, validating CSS.
Also, yes, *
can be used to work around the bug, but it's still a bug.