DotNetNuke® Websites: Problem — Design — Solution

8.3. Solution

Because a number of CSS stylesheets are in play when a DNN website is loaded, it is important to understand the order (hierarchy) at which DNN loads and interprets them.

DotNetNuke reads the CSS code from files in the following order:

• default.css: The default stylesheet created by DotNetNuke upon installation, stored in the Portals/_default/directory.

• skin.css: The stylesheet created with the skins loaded by the current page skin.

• container.css: The stylesheet loaded by the current page container (a separate container.css file may or may not exist, as the container CSS styles may be optionally included in the skin.css file).

• portal.css: The stylesheet generated by DotNetNuke for each portal in your installation. A default portal.css file template is located in the Portals/_default/directory and copied to each portal folder. If your portal is a parent portal, the portal.css file is found in the Portals/0 directory. If your portal is a child portal, the portal.css file is found in the Portals/X directory, where X is the number of your portal (1, 2, 3, and so on).

As you can see, potentially four different CSS files are read by DNN when a page is loaded, with the portal.css file being the ultimate overriding stylesheet. Why is this important to understand? Because of the way DNN inherits the settings from each CSS file. Let me explain this further.

As each style sheet is read, its styles are applied to various elements within your DNN website. If two style sheets contain ...