Hidden Cascading Style Sheet
Last Post 03/27/2008 4:18 AM by Lee Sykes. 3 Replies.
Author Messages
rodriguez
Nuke Active Member
Nuke Active Member
Posts:26


--
03/22/2008 2:05 PM  
Hi,

I was working with the example XHTML template "Internet Sharing" which was converted to a DNN skin and made available in issue 24.  I am slightly confused.   The CSS sheet for both the skin and the containers is located in the skin package for the skin, though the the container package, which contains multiple containers references the skin.css file without any explicit link to the skin directory.  I am confused on this issue as I have not seen the installation of skins and containers before.

Sincerely,
Altein 
rodriguez
Nuke Active Member
Nuke Active Member
Posts:26


--
03/22/2008 8:16 PM  

Hi,

I realise I was a bit unclear in my previous post.  Issue 24 provides a CSS skin for the sample XHTML template called "Internet Sharing".  The issue provides both a skin.zip and a container.zip file.


  The skin.zip file contains the following files
 

  • images folder
  • index.htm
  • index.doctype
  • skin.css
  • skin.xml

The container.zip file contains the following files
  

  • container.css (empty)
  • a standard xml container file used throughout tutorials(container.xml)

and the various code for the containers

  • h1 title
  • h2 title
  • h3_lowercontent_panes.htm
  • other containers...

The various containers reference CSS properties contained in the skin.css file and not the container.css file.  I don't understand how this architecture works.  I'd be most appreciative some explanation regarding how and why the containers' code reference the skin.css file and why the container.css file is not used to specify the CSS properties for the containers instead of being left blank.

Thanks ahead,
Altein 

Joseph Craig
DNN MVP
Posts:11667


--
03/23/2008 9:43 AM  
This is the way that cascading style sheets work, and is the power. You don't HAVE to have container.css files. If you don't, they styles are inherited from higher levels (module, portal, default).

Even if you have a container.css file, it's only to define styles that might not be present in the other files, or to redefine styles just for the container.

Joe Craig, Patapsco Research Group
Complete DNN Support
Lee Sykes
DNN Creative Staff
Nuke Master VI
Nuke Master VI
Posts:4945


--
03/27/2008 4:18 AM  
A good way to view the cascading and how it is inherited is to use the web developers toolbar, checkout Troubleshooting DotNetNuke Skins for info.

In the web developers toolbar go to the CSS menu / edit CSS

In here you can see tabs for each CSS file that DNN reads, so you can see that the CSS files read are module.css, default.css, skin.css, container.css

So you could actually put the containers CSS code in any of these files.

You may also want to have a read of:
Introduction to CSS and inheritance in DotNetNuke skins

Thanks,


Lee Sykes
Site Administrator
Subscribe to the website : DotNetNuke Video Tutorials : The Skinning Toolkit : DotNetNuke Podcasts

Twitter: www.twitter.com/DNNCreative

Lee Sykes's Facebook Profile


---