I'm sometimes using some diagnostic CSS, so my default CSS template includes this line
@import url(diagnosticX.css); /* Remove in production?! */
I just remove the "X" and some errors on the page get highlighted.
The comment should remind me, that this isn't meant to be in production CSS, yet i never bother to remove the line. Who cares? It points to a CSS file, which will never exist, so the browsers will ignore it anyways.
Turns out it can be harmful in some cases. One such case includes Typo3 and Safari.
If a resource doesn't exist, Typo3 returns a nicely layouted error page. Since the developers care about good CSS, they include some
CSS rules in the head part of the error page. Safari trying to do its best to parse this file as CSS actually understands those CSS rules. The effect is that the non existant diagnosticX.css file does hold some layout commands and those affect the page layout.
The mistake is on Safaris side, i think, since Typo3 seems to return a 404 error page and Safari must not parse CSS files that come in with a 404 status code.
Nonetheless i change my template, so i don't forget to remove it.
@import url(diagnostic.css); /* Remove in production! */