3 ms·

Not so sure that “last declaration wins” would be great — a very specific example: jupyter notebooks (used to?) add custom.css before the original stylesheet. I

Not so sure that “last declaration wins” would be great — a very specific example: jupyter notebooks (used to?) add custom.css before the original stylesheet. It’d be impossible if that were the case, I guess?

woodrowbarlow 6y ago
why? custom.css would still be loaded, just that if any rules conflict between the two, the original stylesheet would win. if custom.css makes some text bold and red, and then a second stylesheet comes along and makes the text blue, the final text would be bold and blue. but with CSS specificity defining priority, whether the text is blue or red depends on which file has the gnarliest, most complicated selector. custom.css could be put after the original instead of before if you want the custom rules to win.
- prashnts 6y ago
  Ah, thanks for the explanation -- I thought that you meant that custom.css would be disregarded, now I see you meant that css _rules_ should use "last declaration wins". Not really a followup on my previous question: what would be done if, say one can't change the order: so custom.css is still before original css. In such cases, without the specificity rule, wouldn't the only option we'd have is to somehow inline the styles, or spray !important everywhere? To be clear, I only ever did this once for jupyter, and using very specific selectors was the only way I could do it -- of course I learned it hard way why this approach isn't great when jupyter changed the layout slightly. :) If you're curious, https://github.com/prashnts/dotfiles/blob/0a2e98a848a98b7010fa8e0572eb0b4f39e1742a/jupyter/custom.css#L156 https://github.com/prashnts/dotfiles/blob/0a2e98a848a98b7010... is that custom.css
  - woodrowbarlow 6y ago
    that's true, but that's pretty much the experience of writing userstyles anyway. i remember back in the greasemonkey days, their built-in editor even had an option to automatically append `!important` to every line when you click save.

woodrowbarlow 6y ago

why? custom.css would still be loaded, just that if any rules conflict between the two, the original stylesheet would win. if custom.css makes some text bold and red, and then a second stylesheet comes along and makes the text blue, the final text would be bold and blue. but with CSS specificity defining priority, whether the text is blue or red depends on which file has the gnarliest, most complicated selector. custom.css could be put after the original instead of before if you want the custom rules to win.

prashnts 6y ago
Ah, thanks for the explanation -- I thought that you meant that custom.css would be disregarded, now I see you meant that css _rules_ should use "last declaration wins". Not really a followup on my previous question: what would be done if, say one can't change the order: so custom.css is still before original css. In such cases, without the specificity rule, wouldn't the only option we'd have is to somehow inline the styles, or spray !important everywhere? To be clear, I only ever did this once for jupyter, and using very specific selectors was the only way I could do it -- of course I learned it hard way why this approach isn't great when jupyter changed the layout slightly. :) If you're curious, https://github.com/prashnts/dotfiles/blob/0a2e98a848a98b7010fa8e0572eb0b4f39e1742a/jupyter/custom.css#L156 https://github.com/prashnts/dotfiles/blob/0a2e98a848a98b7010... is that custom.css
- woodrowbarlow 6y ago
  that's true, but that's pretty much the experience of writing userstyles anyway. i remember back in the greasemonkey days, their built-in editor even had an option to automatically append `!important` to every line when you click save.