CSS Files are Combined and Minified
After version 2.2.7.7, we implemented a solution to combine and minify CSS files in the skins. All the included skins have been updated. If using a custom skin you need to update your skin as follows:
1. open layout.master file in a text editor and replace this:
<portal:StyleSheet id="StyleSheet" runat="server" />
with this
<portal:StyleSheetCombiner id="StyleSheetCombiner" runat="server" />
2. copy the file style.config from any of the other skins into your custom skin. This file is a list of css files to include and combine.
Debugging CSS Problems
You can debug the css by manipulting these settings:
<add key="CombineCSS" value="true" />
<add key="MinifyCSS" value="true" />
you have to both clear the server cache by touching Web.config and clear the browser cache for changes to these settings to take effect or to see changes you make to css.
you can for example set MinifyCss to false, then view the source of the page and grab the full url for csshandler.ashx and paste it into a new browser tab to see the css un-minified.
As of version 2.2.8.1 updated 2006-12-22, there are 2 new Web.config settings that can make it easier while you are designing your skin. By default the css is cached heavily both on the server and in the browser, and this is ideal most of the time. But when you are designing your skin this caching can be a hassle because you have to keep clearing the cache. Now these 2 Web.config settigns allow you to disable the cache while you are designing.
<add key="CacheCssOnServer" value="true" />
<add key="CacheCssInBrowser" value="true" />
Ideally you will set those back to true when you are finished designing your skin.
After resolving any problems I recommend set both settings back to true.
Problems with Background Images
If you are having problems with background images not appearing, review your CSS files and look for the places where you are setting background images and make sure the urls are single quoted like this:
url('someimage.gif')
if they are double quoted or don't have any quotes it causes problems with the CSS combining. We have to resolve the full url from code and the single quotes makes it work best. After fixing these, clear the server cache by touching Web.config and clear the browser cache.
Problems with the Tabs in Settings Pages
If your custom skin is missing the Tabs in the settings pages after an upgrade, make sure your style.config has this in it like all the other skins do:
<file csswebconfigkey="YUITabCss" imagebasewebconfigkey="YUISkinImagePath">none</file>
<file cssvpath="/ClientScript/oomph/oomph.css" imagebasevpath="/ClientScript/oomph/">none</file>
and make sure you have this in Web.config:
<add key="YUIBasePath" value="~/ClientScript/yui-252/" />
<add key="YUITabCss" value="~/ClientScript/yui-252/assets/skins/sam/tabview.css" />
<add key="YUISkinImagePath" value="/ClientScript/yui-252/assets/skins/sam/" />
actually the value for the above settings will change over time as we upgrade to new versions of YUI, the main thing is that these settings must be present and pointing to the correct version of YUI
Last Updated 2008-12-08 Joe Audette