How to use two unique stylesheets on one page

[Chappers]

Hi

I want to use two different stylesheets with on page. I've got a php include function adding a comment form to one of my web pages, and would like this comment form to have its own stylesheet, rather than make include things for the comment form into the main site's stylesheet.

Is this possible? I assume it's important, if two can be used, to make sure that the two don't have similar things, like both having settings for "body", etc. Unless it's possible to keep one working just for the comment form, by applying the sheet before the comment code is added, and closing it afterwards?

The main page has the stylesheet linked like this:

[code]<style type="text/css" media="all">@import "css/style.css";</style>[/code]

And that's it.

Many thanks for any help,
James

[cmgmyr]

Why don't you just use one style sheet and include the comment for stuff in it. Wrap the comment include with a div id=comment_wrap

then in your css

#comment_wrap{
...
}

#comment_wrap .some_class{
(This class will only show up when it's in the comment_wrap div)
}

Hope this helps, Let me know if you have any questions

-Chris

[Chappers]

Thanks for that info Chris, it's helped broaden my knowledge of CSS a bit more. I'll implement it like you've said, but first there's one other thing I don't understand if you wouldn't mind shedding some light please?

The styles are within the included [i]comment form[/i] at the moment, but it'd be easier for me if they were in a separate stylesheet, which is why I wanted to know how to do the above.

Thing is, the comment form includes BBCode so people can add formatting to their comments. The styles for this formatting are put like this in the comment form code:

[code]?>
<style type="text/css">
<!--
body {
font: 12px Verdana, Helvetica, sans-serif;
}
.bold {
font-weight: bold;
}
.italics {
font-style: italic;
}
.quotebody {
background-color: #FFFFFF;
font-family: Verdana, Courier new, courier, mono;
font-size: 11px;
color: #660002;
border: 1px solid #BFBFBF;
}

etc... etc...

-->
</style>[/code]

And later in the code more styles are laid out in this fashion, for the actual layout of the comment form itself, but they are not commented out, like the above ones.

If I remove the [code]<!-- -->[/code] from the above, it then messes up the layout of the comment form and the main page within which the form is included.

How would I go about adding the commented-out style code above into the main stylesheet without it messing other things up? And to help me understand, how come it's commented out yet still working, and why aren't the rest of the styles later in the code commented out?

[cmgmyr]

You can just copy [code]body {
font: 12px Verdana, Helvetica, sans-serif;
}
.bold {
font-weight: bold;
}
.italics {
font-style: italic;
}
.quotebody {
background-color: #FFFFFF;
font-family: Verdana, Courier new, courier, mono;
font-size: 11px;
color: #660002;
border: 1px solid #BFBFBF;
}

etc... etc...[/code] into your main style sheet and it should still work, just don't put the <style> or the comments stuff in.

What you sould do is where you past in the BB CSS you add the #comment_wrap to it. then it is just used in the comment_wrap div
[code]#comment_wrap .bold {
font-weight: bold;
}[/code]

I don't really know why you have to put the comment tags in the CSS if it is in the regular html page. I'm taking a guess here, but i think that it has something to do with how browsers read the <style>'s...but I could be totally wrong on that on. I'll try and research that and see what I can come up with.

hope that helped,
-chris