Cayce Cookbook - CSS Page Templates

Basic Page Templates

This is a collection of templates adapted from the site, www.primarycss.com. I've adapted them to be more useable, on my own terms, and ready to go. See a selection page at the above link.

Triad iMedia Index Template

This is the structural, all CSS template I developed for the Triad iMedia index page. It includes examples of:

  • Z-Index for a floating transparent header graphic
  • Floats, combined left & right
  • Usage of the Clear property
  • Multiple nested DIVs
  • Vertical Divider Double-Rule
  • Full DIV Image Background
  • Table-Based Drop Shadows

It also has an interesting transluscent header that changes opacity on hover (the translucence was applied solely for the purpose of seeing the underlying structure).

Absolute Basic CSS Template

Single Content DIV within a window_wrap and outer_div, all centered. No frills.

CSS Page Starter Kit with Header Navigation

From the New Paulist Press page build.

  • Three-Column Body with Header & Footer
  • Header Uses Sprites & Background Positioning for state behaviors.
  • Navigation Uses Graphic Sprites and Text Links.
  • Includes a separate, stand-alone Search Button, with behaviors.
  • Is a Complete Header and CSS Body Starter Kit.
  • Also includes Sprite Builder PSD (download below).

Get the Page

Get the CSS Sheet

Get the Sprite-Builder PSD

Get the Full Kit