dslax27 Posted December 21, 2010 Share Posted December 21, 2010 The 10-second explanation of my problem: I run a Wordpress CMS with a stylesheet that looks great I installed a forum plugin that has dull styling There are CSS stylesheets specific to this plugin that look great, but when they are installed they change the entire Wordpress theme Can I run two stylesheets at once pointing at the same page? One would control the mother Wordpress theme and the other would control the elements specific to the forum plugin. If so, what happens when there is a "#content" class on each sheet? Can't they both just get along?? My code structure looks like this: [HEADER] <div id="container"> <div id="content"> [PAGE CONTENT] <div id="box"> <div id="containingdivfortheforum"> [FORUM PLUGIN CODE] </div> </div> </div> <div id="sidebar"> [sIDEBAR CONTENT] </div> </div> [FOOTER] Quote Link to comment Share on other sites More sharing options...
haku Posted December 21, 2010 Share Posted December 21, 2010 You can have multiple styles and stylesheets with no problem. The priority goes like this: inline styles > on page (in the <head>) styles > external stylesheets. So an inline style will override a style declared in the head of the document, and a style in the head of the document will override an external stylesheet. If you have multiple selectors in the same area (i.e. both in an external stylesheet), then the one with higher specificity will take precedence. If you have two selectors in the same area that have the same specificity, then the one that comes last will take precedence. Quote Link to comment Share on other sites More sharing options...
dbrimlow Posted December 21, 2010 Share Posted December 21, 2010 Haku's answer is, of course, literally correct, one can always use inline styles to over-ride a previous style or stylesheet. However, it is not recommended since the whole point of stylesheets is to get the styling OUT of the markup in the first place. Also, it is way too involved and unwieldy to use inline styles in a CMS template without knowing basic PHP. To answer your question, for your purposes (and intent), you cannot apply the same select name, like "#content", with different attributes from two different stylesheets. The page willl only use the set of attributes for #content from the last css file or stylesheet it read. This is the "cascade" in cascading style sheets (and what Haku meant by "specificity"). What most of us would do is to change any duplicate select name in the forum plugin's css file from "#content" to say "#forumcontent". Then in the WP template: <div id="forumcontent"> [FORUM PLUGIN CODE] </div> It is strange that a WP plugin would use the same select ID as a known standard WP select ID. Good luck, Dave Quote Link to comment Share on other sites More sharing options...
haku Posted December 22, 2010 Share Posted December 22, 2010 I wasn't recommending using inline styles, I was just giving an overview of what selectors will take priority in the case that there are more than one selector for the same element. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.