3 ms·
A useful hack if you want to support very old browsers is to link your external CSS via @include inside HTML comments. Pardon errors, coffee hasn't kicked in ye
by giantrobot 3y ago
A useful hack if you want to support very old browsers is to link your external CSS via @include inside HTML comments. Pardon errors, coffee hasn't kicked in yet:
<style type="text/css">
<!--
@include('main.css')
@include('blah.css')
-->
</style>
Old IE and Navigator versions that would try to load your CSS will ignore the CSS inside the comments. If you add text and background color attributes on the <body> tag you'll even be able to maintain colors on old browsers.
So long as your unstyled layout is sane, old browsers will display a useful rendition of your page. Or at the very least not completely broken.
This same hack can be used to hide JavaScript from old browsers. It also works if you're inlining CSS.
- kstrauser 3y agoI'd forgotten about that. I could search for the answer but I think it's more fun to talk about it: how did that work? Wouldn't that make all browsers ignore the includes?
- giantrobot 3y agoHTML comments are not valid CSS. But no one told old IE and Navigator versions this important fact. It's for the best because they didn't really handle CSS all that well. If they encountered 2.x properties they'd often lose their shit and mess up the whole layout from spite. Eventually both caught on and interpreted everything in the <style> tag as the declared language and thus ignored the inappropriate HTML comment tags. At the same time their CSS handling also improved so they'd break less badly when actually encountering CSS.