Multiple stylesheets per HTML page?

[johnnygeo]

I'm building a series of pages in HTML which will essentially mimic a slide show; each page will have a very unique and complex layout.

For the sake of my own sanity, I want to have one .css control the text style and formatting, and a separate .css for each page to control the positioning of layout items (boxes of text and so on).

So in the header of the HTML page, I tried to put

<link type=&quot;text/css&quot; rel=&quot;stylesheet&quot; href=&quot;style_master.css&quot;/>
<link type=&quot;text/css&quot; rel=&quot;stylesheet&quot; href=&quot;style_slideX.css&quot;/>

where "_slideX" refers to the specific layout .css for that particular slide number.

But only the first .css is being applied. How can I load two stylesheets for the same page?

Thanks,
Johnny Geo

 

[dwarfthrower]

If the two css files contain definitions for the same classes then only the last ones to be defined will be displayed. What you have is fine for loading two stylesheets, so I'd look to a conflict between the two.

_{Never be afraid to share your dreams with the world.
There's nothing the world loves more than the taste of really sweet dreams.}

 

[johnnygeo]

Thanks, dwarfthrower. Based on your reply I tried the page again using IE and it worked fine. So this looks like an issue with Mozilla Firebird (my default browser); it is definitely not applying both stylesheets.

 

[dilettante]

I agree, it must be a browser issue.

I routinely separate things into 3 stylesheets:[ul]
[li]Positioning/margins/padding/borders,
[li]Color scheme, and
[li]Fonts and text attributes.[/ul]
Works great in IE with both internal and external styles.