Multi-Column Text Wrap

Equalizes depth across columns. See Creds Page as example and code source.

Page Templates

A collection of Page Constructs using CSS

Link Behaviors

A collection of Hovers, Visited States, etc.

Element Swap-Outs

Local & Remote Content Swaps.

Button Effects

Single to Multiple Sprite Effects

Indent Second Line

This must be done with a combination of a first line indent and a negative paragraph margin.

CSS RECIPES

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).

CSS/JAVASCRIPT RECIPES

Triad Remote Swap-Out

Nav Column or right swaps out Content on Left

Buttons

CSS Sprite MouseOver - Complex

Uses a single image sprite for a four-stage rollover, CSS driven. This setup requires all menu elements to be the same width.

Documentation - Safari Archive

Documentation - FireFox Archive


CSS Sprite MouseOver - Simple, Single Element

Simple two stage image sprite rollover.

Documentation - Safari Archive