CSS tips and snippets
Feel free to grab and use anything you see here. Just click on the Markup or CSS links in the header to show the code, then look
for the 
in the upper right corner and click on it to place the code in your clipboard.
- layouts
- a fluid width, with min/max, equal height 2-column layout
- my faux columns demo
- full height layout with header/footer - works with or without content
- simple 2-column with header and footer
- this is as simple as a 3 column layout can get
- fixed width 3-column equal height w/header and footer using faux columns
- fixed width center column with fluid width left and right sides
- drop shadow around container
- 3 equal width divs
- 4 equal width divs
- lists
- three column ul
- li images/bullets
- two column dl
- dl with images and captions
- dl with included ul
- backgrounds
- fixed background
- background image resize
- photo presentation
- fluid, centers thumbs - I've been perfecting this one for a long time
- a simple disjointed rollover
- image captions made easy
- scrolling boxes, both vertical and horizontal
- menus
- basic ul menu
- horizontal navbar, in a ul, no images
- horizontal menu with dividers between the buttons
- horizontal ul navbar NO images - with breadcrumb
- CSS rollover
- horizontal ul navbar using images - with breadcrumb
- horizontal ul navbar done with a single image - with breadcrumb
- tabs made with the sliding door method
- tabs made using CSS rollovers
- horizontal navbar using images in divs instead of in a ul
- CSS only dropdown menu - no js
- similar CSS only dropdown menu with dropped links horizontal
- vertical ul menu with flyout links
-
centered menus
- .js stuff
- hidden slider panel for menu
- scroll to top - brings you back to the top of a long document
- a cool js div switcher
- links
- styling links
- tips
- clearing floats
- tooltips
- no wrap
- horizontal lines
- set minimum width
- force a vertical scrollbar
- uncolapsing margin
- hide email from spambots - js solution
- positioning images and text
- tricks
- getting normal text and opacity to work together
- position fixed in IE6
- vertically centering stuff
- fluid resizing boxes
- rounded corners with images
- 3 boxes with rounded corners - CSS only, no images
- CSS3 stuff
