Breadcrumb CSS customization

Hello,

How to customize the Breadcrumb widget with multiple CSS classes (One css class for parent page and another css class for active page)? 

The advanced parameter allows to load only one css class.  Our custom HTML is given below, how to achieve this kind of behaviour with sitefinity widget? Kindly advice. 

<div class="bread-crumb">
<div class="bread-cont first"><a  href="#"><span>Home </span> </a></div>
<div class="bread-cont"><a  href="#"><span class="active-bread">About Us</span> </a></div>
<div class="bread-cont"><a  href="#"><span>Our services</span> </a></div>
<div class="bread-cont"><a  href="#"><span>system Tools</span> </a></div>
<div class="bread-cont"><a  href="#"><span>Consulting</span></a></div>
</div>

Thanks,
Raja

Hi Raja,

The breadcrumb widget renders way too much HTML and CSS. You need a custom control if you want to get rid of it. This thread may help you.

I guess this should do the trick for the first Item

Markus

Hi All,

 I want to make current page's name style different from rest of the names in bread crumbs.

Please help me,how do i achieve this.