456 – Bulletproof shrinkwrapping buttons

This is a demo document for the technique described in the article Creating bulletproof graphic link buttons with CSS.

A successfull bulletproof image-based button should:

  • Automatically grow horizontally to fit any amount of text
  • Grow horizontally and vertically if text size is increased or if the text wraps to multiple lines
  • Retain its appearance within reasonable limits
  • Be able to have rounded (or other non-square) corners
  • Have no unclickable areas
  • Be readable when images are disabled

A bag-full of mark-up required but pretty neat.

About this entry

You’re currently reading “456 – Bulletproof shrinkwrapping buttons,” an entry on pilmore, lee

Published:
05.23.07 / 8am
Category:
CSS, Markup, Web design