JSFiddle - React, Tailwind, and code Playground

by grafixguy76

HTML

<div id="breadcrumbs">  
    <ul id="crumbs">  
        <li><a href="#" style="z-index:9;"><span></span>Blog Home  &gt;</a></li>  
        <li><a href="#" style="z-index:8;">Archives &gt;</a></li>  
        <li><a href="#" style="z-index:7;">2011 Writing &gt;</a></li>  
        <li class="last">Tips for jQuery Development</li>  
    </ul>  
</div>

CSS

/* ul, li {list-style-type:none; padding:0; margin:0; text-decoration:none; }
#breadcrumbs {color:#d5d5d5; line-height: 20px; overflow:auto; font-size:12px; font-weight:bold; font-family: sans-serif; }
#breadcrumbs li { float:left; padding-left:8px;}
li a {color: #83B03C;} */
crumbs.last a {text-decoration: none; color: #83B03C;}
body {
	font:71%/165% "Lucida Grande", Lucida, Verdana, sans-serif;
	}
ul, li {
	list-style-type:none;
	padding:0;
	margin:0;
	}		
#crumbs {
	height:2.3em;
	border:1px solid #dedede;
	}
#crumbs li {
	float:left;
	line-height:2.3em;
	color:#777;
	padding-left:.75em;
	}		
#crumbs li a {
	background:url(http://www.stonewalkdentistry.com/mediumblue/dev/images//design/crumbs.gif) no-repeat right center;
	display:block;
	padding:0 15px 0 0;
	}							
#crumbs li a:link,
#crumbs li a:visited {
	color:#777;
	text-decoration:none;
	}	
a:link, a:visited,	
#crumbs li a:hover,
#crumbs li a:focus {
	color:#dd2c0d;
	}	
#crumbs li.last {color: #83B03C; }