A CZG Domain Landing.
Circa 2003, CSS adoption with seriousness was still sparse. Web development enlightenment has been achieved thanks to the tireless efforts of many such as the W3C, WaSP and the major browser creators.
The CSS Zen Garden (CZG) has played an important role in this development. Begin to see with clarity. Learn to use the (now in fact) time-honored techniques in new and invigorating fashion. Use "View CZG Designs" or reload as the references to selecting from designs were hardcoded in images in some designs.
This is the HTML portion of the CSS Zen Garden page adapted for display in a <<random style>> from the garden as the root page of one of my web domains. The copy remains the same, the only thing that has changed is the external .css file. Reload this page to confirm.
CSS allows complete and total control over the style of a hypertext document. I have adapted this a number of times to my purposes and in this case am repurposing the navigation elements and generally moving to adapt the designs for active content as Ekendra Dass did for drupal with Skyroots (CZG 123). The next div explains navigation changes for the Domain Landings use.
"Select A Design" (lselect div) has selected links was going to be dominion SSO but changing to have "Login to <domain>" link to DCP login.
"Resources" (lresources div) CZG with PM replacing CSS, my FAQ added.
"Archives" (larchives div) is used to access the CZG and those of my domains that do not use this landing page. My use of CZG is like that done with Skyproots (CZG 123) by Dass but applying to more than one and is complementary to the use I make elsewhere in my domains such as the mediawiki CMS.
Text here in real CZG is particularly stale, written when CSS and js had not come to their present (2012) UI dominance. It encourages participation in the CZG but Dave Shea long ago stopped accepting new submissions, For what I suppose are natural reasons, there has been little activity in adapting this or anythng like it to active content. Currently, I am trying to address this and my focus is mainly on theming such as C-六 and Yesod Shakespearean templates .
The CZG would like to see as much CSS1 as possible. CSS2 should be limited to widely-supported elements only. The css Zen Garden is about functional, practical CSS and not the latest bleeding-edge tricks viewable by 2% of the browsing public. The only real requirement we have is that your CSS validates.
Unfortunately, designing this way highlights the flaws in the various implementations of CSS. Different browsers display differently, even completely valid CSS at times, and this becomes maddening when a fix for one leads to breakage in another. View the Resources page for information on some of the fixes available. Full browser compliance is still sometimes a pipe dream, and we do not expect you to come up with pixel-perfect code across every platform. But do test in as many as you can. If your design doesn’t work in at least IE5+/Win and Mozilla (run by over 90% of the population), chances are we won’t accept it.
The CZG asks that you submit original artwork. Please respect copyright laws. Please keep objectionable material to a minimum; tasteful nudity is acceptable, outright pornography will be rejected.
This is a learning exercise as well as a demonstration. You retain full copyright on your graphics (with limited exceptions, see submission guidelines), but we ask you release your CSS under a Creative Commons license identical to the one on this site so that others may learn from your work.
Bandwidth for the actual CZG graciously donated by DreamFire Studios