View Full Version : Didja know...


Mr. Initial Man
04-20-2004, 11:52 AM
You can use more than one external CSS sheet for a single HTML page?

I wanted special scrollbars, but the CSS for that wouldn't validate, and I wanted my setup CSS to be valid. So, today, I tried an experiment: Put all the scrollbar stuff in one CSS sheet, seperate from the setup sheet, and called it scrollbar.css. I then had a link to BOTH sheets (i.e. two <link>s) in my head, and lo, and behold, I had my scrollbars.

pb&j
04-20-2004, 02:22 PM
yes, you are correct. a number of style sheets may be applied to a single page.

for validating scrollbars, this may be used...
<script type="text/javascript">
window.onload = function()
{
var htmlStyle = document.getElementsByTagName('html')[0].style;
var bodyStyle = document.body.style;
bodyStyle.scrollbarFaceColor = htmlStyle.scrollbarFaceColor = '#000000';
bodyStyle.scrollbarArrowColor = htmlStyle.scrollbarArrowColor = '#000000';
bodyStyle.scrollbarTrackColor = htmlStyle.scrollbarTrackColor = '#000000';
bodyStyle.scrollbarShadowColor = htmlStyle.scrollbarShadowColor = '#000000';
bodyStyle.scrollbarHighlightColor = htmlStyle.scrollbarHighlightColor = '#000000';
bodyStyle.scrollbar3dlightColor = htmlStyle.scrollbar3dlightColor = '#000000';
bodyStyle.scrollbarDarkshadowColor = htmlStyle.scrollbarDarkshadowColor = '#000000';
}
</script>

edit... there should be no space in this part... ('htm l')

Calidris
04-20-2004, 06:02 PM
The above example technically validates, but it is flawed if it is misused. The JavaScript is simply skipped over by validators. For example: if you used JavaScript to put a <font> tag into your page, the code would validate at W3C but on screen the outputted document wouldn't actually be valid - which defeats the point of wanting to validate in the first place.

A different approach would be to use IE conditional comments:
<style type="text/css"> @import url('my_style.css'); </style>
<!--[if IE]>
<style type="text/css"> @import url('my_scrollbars.css'); </style>
<![endif]-->
The W3C CSS validator should ignore the stylesheet and not attempt to validate it - but I haven't checked this because I think IE is two piles of pants.

I much prefer the import method of calling in multiple stylesheets. I tend to use <link>'ed stylesheets only when I want the user to be able to switch between different styles (alternate stylesheets).