Dec
09

Breadcrumbs with increasing indentation

AmR Breadcrumb  

A vertical use of the Breadcrumb widget

Indented Breadcrumbs

Indented Breadcrumbs

A query was received from Kim for  http://metakosmia.dk, asking how to indent successive levels of the breadcrumb widget links.  This was not possible in version 1.1, so version 1.2 has been released with css classes added for each breadcrumb indicating it’s depth in the menu.  This css class allows you then to assign your own styling to the levels.

Example CSS:

#amr-breadcrumb .lvl2{ padding-left: 1em;}
#amr-breadcrumb .lvl3{ padding-left: 2em;}
#amr-breadcrumb .lvl4{ padding-left: 3em;}

HTML generated:

HTML generated

HTML generated

Share:
  • Digg
  • del.icio.us
  • Facebook
  • RSS
  • Technorati
  • Twitter

Related posts:

  1. Subscribe2 Widget Form – an alternate The wordpress subscribe 2 plugin is great – however the form in the widget bothers me. I have raised this ...
  2. Wordpress Breadcrumb Widget Released First of a series of widgets is a breadcrumb navigation widget, that offers a default “apple.com” like style, with minimal...
Categories : AmR Breadcrumb

Leave a Comment