Scalable CSS-Based Breadcrumbs

Veerle’s blog is presenting a tutorial, with source codes, on creating a simple & scalable css-based breadcrumbs.

What are breadcumbs?

From Wikipedia: Breadcrumbs or breadcrumb trail are a navigation technique used in user interfaces. Its purpose is to give users a way to keep track of their location within programs or documents.

Only 1 image is used for creating this navigation which is the seperator. It is a bigger image than the displayed one considering the breadcrumb will be scaled when needed.

A handy resource on a method that is used in almost every web application. To see the demo, click here.