 |
 | Home | Contact Us | FAQ | Search & Site Map | Link to Us |
 | Sign In | Join | Other 45 Sites in Network |
| HomeDiscussion GroupsGeneralPHPASPPerlColdFusionFlashHTML, CSS, ScriptsBrowsers |
Webmaster Forum / HTML, CSS, Scripts / CSS / February 2008your thoughts on applying multiple stylesheets to a page
I have a main stylesheet that I apply to all pages in a site, they each sub-section has a subsection stylesheet that either overrides or applies new style to pages in that subsection, then finally each page in a subsection may need even more fine tuning. In the past I would use <link href="page.css" rel="stylesheet" type="text/css">, then in page.css I would import section.css, and section.css would import main.css. I am looking at changing to multiple link tags like: <link href="main.css" rel="stylesheet" type="text/css"> <link href="section.css" rel="stylesheet" type="text/css"> <link href="page.css" rel="stylesheet" type="text/css"> Assuming I am careful to consider the cascade, is there anything I should be careful of using this method to apply multiple stylesheets? Also, what are the implications of using or not using a common title attribute? > I have a main stylesheet that I apply to all pages in a site, they each > sub-section has a subsection stylesheet that either overrides or applies [quoted text clipped - 12 lines] > Assuming I am careful to consider the cascade, is there anything I > should be careful of using this method to apply multiple stylesheets? The issue with multiple stylesheets, is that each one has to be fetched. three links will give the browser the opportunity to fetch them in parallel, will help some, but the overhead is still heavy. Include the page stuff in the page or into the session file. Then probably use one link to the section css file which would contain the main.css stuff repeated for each. If the main is large and the section one tiny I might use two links, but I prefer to use one. That way I can see it all the CSS in one place. The overhead of sending css to the browser that is not used in a page, is tiny, if the css is reused in later pages. > Also, what are the implications of using or not using a common title > attribute? What? The title attribute provides text that appears as a tool tip to the user, for various durations, in some browsers, and not at all in other browsers. Not a CSS issue. Regards Ian > The overhead of sending css to the browser that is not used in a page, > is tiny, if the css is reused in later pages. Agreed. Caching is A Good Thing.  SignatureBerg > The issue with multiple stylesheets, is that each one has to be fetched. > three links will give the browser the opportunity to fetch them in > parallel, will help some, but the overhead is still heavy. Since each common stylesheet like main.css or section.css will only need to be fetched on the first page that needs it, and cached for any subsequent pages, I think the overhead issue should be under control. > What? The title attribute provides text that appears as a tool tip to > the user, for various durations, in some browsers, and not at all in > other browsers. Not a CSS issue. Actually use of the title attribute designates a stylesheet as preferred. Setting the rel attribute to "alternate stylesheet" and using the title attribute designates a stylesheet as alternate. I did read something about setting title to the same value in several link elements combines the sheets into one, which might impact the cascade, but it's not obvious to me how or if it really does. It's an HTML issue, but it impacts the css. >> What? The title attribute provides text that appears as a tool tip > > Actually use of the title attribute designates a stylesheet as > preferred. You didn't make it clear you were referring to the stylesheet title. I also read your original question as a more general inquiry about the title attribute. > I did > read something about setting title to the same value in several link > elements combines the sheets into one, Yes, that's true. > which might impact the cascade, > but it's not obvious to me how or if it really does. It does. All stylesheets with the same title are considered one, so cascading does happen. IE doesn't support alternate stylesheets, of course, but other browsers do. SignatureBerg > You didn't make it clear you were referring to the stylesheet title. I > also read your original question as a more general inquiry about the > title attribute. I was talking about sequential link elements, and commented about the use of a common value for the title attribute (of the link element). Since the html spec for link specifically mentions "The title attribute has an additional role when used with the LINK element..." Not sure if the distortion was the fault of the transmitter or the receiver. I'll try to be clearer without implying unmentioned/unassumed is synonymous with clueless as some here do <g>. > I did read something about setting title to the same value > in several link elements combines the sheets into one, > which might impact the cascade, but it's not obvious to me > how or if it really does. See http://www.unics.uni-hannover.de/nhtcapri/ruby-annotation.html for an example. SignatureIn memoriam Alan J. Flavell http://groups.google.com/groups/search?q=author:Alan.J.Flavell >> I did read something about setting title to the same value >> in several link elements combines the sheets into one, [quoted text clipped - 3 lines] > See http://www.unics.uni-hannover.de/nhtcapri/ruby-annotation.html > for an example. I see the browser allows the choice/application of either stylesheet. My original thought was about what difference it makes to "combine sheets into one" as opposed to sequentially applying them, but trying to figure It out gave me too big a headache for too little return on investment (i.e. I know how sequential application works, and it's not worth seeing if "combining as one sheet" is any different). for example if I link sheet1.css and sheet2.css, in that order, and both have different style for #notes, the style specified in sheet2 is applied since it is applied last. > The title attribute provides text that appears as a tool tip to the > user, for various durations, in some browsers, and not at all in other > browsers. Not a CSS issue. LINK can have a TITLE attribute; see http://www.htmlhelp.com/reference/css/style-html.html#ex1 SignatureIn memoriam Alan J. Flavell http://groups.google.com/groups/search?q=author:Alan.J.Flavell > I am looking at changing to multiple link tags like: > <link href="main.css" rel="stylesheet" type="text/css"> [quoted text clipped - 3 lines] > Assuming I am careful to consider the cascade, is there anything I > should be careful of using this method to apply multiple stylesheets? No. Signaturedorayme > No. Succinct, and very low overhead! <G> .oO(William Gill) >I have a main stylesheet that I apply to all pages in a site, they each >sub-section has a subsection stylesheet that either overrides or applies [quoted text clipped - 12 lines] >Assuming I am careful to consider the cascade, is there anything I >should be careful of using this method to apply multiple stylesheets? Not really. I use both ways in my projects. For example there is a main stylesheet shared between various projects and some additional project-specific stylesheets, all applied with 'link' elements like above. The shared main CSS also uses a number of @import rules to include some other files, which are kept separately simply for the ease of maintenance. The only little drawback is the number of HTTP requests required in order to download all these files. Every 'link' and every @import counts and might slow down the page rendering on the first request. After that all CSS should be in the browser cache. >Also, what are the implications of using or not using a common title >attribute? If you're referring to the 'title' attribute for CSS links - they can be used to offer alternative stylesheets which the user may choose from. Micha > <link href="main.css" rel="stylesheet" type="text/css"> > <link href="section.css" rel="stylesheet" type="text/css"> > <link href="page.css" rel="stylesheet" type="text/css"> > > Assuming I am careful to consider the cascade, is there anything > I should be careful of using this method to apply multiple stylesheets? You must be especially careful about the order of the LINKs when you have stylesheets with "media=print", too. > Also, what are the implications of using or not using a common title attribute? Some (older) browsers like Mozilla 1.7 let the reader disable a stylesheet only when it has a TITLE. SignatureBugs in Internet Explorer 7 http://www.unics.uni-hannover.de/nhtcapri/ie7-bugs |
Reply to this Message |
 Sign In
 Join
 My Latest Posts My Monitored Threads My Blog My Photo Gallery My Profile My Homepage Start New Thread Enable EMail Alerts Rate this Thread
|
©2009 Advenet LLC Privacy Policy - Terms of Use
This website includes both content owned or controlled by Advenet as well as content owned or controlled by third parties.