text-shadow: 0 1px 0 #ffffff;
}
-.breadcrumb .divider {
+.breadcrumb li:after {
+ display: inline-block;
padding: 0 5px;
color: #ccc;
+ content: "\00a0 /";
}
.breadcrumb .active {
<li class="active">Home</li>
</ul>
<ul class="breadcrumb">
- <li><a href="#">Home</a> <span class="divider">/</span></li>
+ <li><a href="#">Home</a></li>
<li class="active">Library</li>
</ul>
<ul class="breadcrumb" style="margin-bottom: 5px;">
- <li><a href="#">Home</a> <span class="divider">/</span></li>
- <li><a href="#">Library</a> <span class="divider">/</span></li>
+ <li><a href="#">Home</a></li>
+ <li><a href="#">Library</a></li>
<li class="active">Data</li>
</ul>
</div>
<pre class="prettyprint linenums">
<ul class="breadcrumb">
- <li><a href="#">Home</a> <span class="divider">/</span></li>
- <li><a href="#">Library</a> <span class="divider">/</span></li>
+ <li><a href="#">Home</a></li>
+ <li><a href="#">Library</a></li>
<li class="active">Data</li>
</ul>
</pre>
<li class="active">{{_i}}Home{{/i}}</li>
</ul>
<ul class="breadcrumb">
- <li><a href="#">{{_i}}Home{{/i}}</a> <span class="divider">/</span></li>
+ <li><a href="#">{{_i}}Home{{/i}}</a></li>
<li class="active">{{_i}}Library{{/i}}</li>
</ul>
<ul class="breadcrumb" style="margin-bottom: 5px;">
- <li><a href="#">{{_i}}Home{{/i}}</a> <span class="divider">/</span></li>
- <li><a href="#">{{_i}}Library{{/i}}</a> <span class="divider">/</span></li>
+ <li><a href="#">{{_i}}Home{{/i}}</a></li>
+ <li><a href="#">{{_i}}Library{{/i}}</a></li>
<li class="active">{{_i}}Data{{/i}}</li>
</ul>
</div>
<pre class="prettyprint linenums">
<ul class="breadcrumb">
- <li><a href="#">{{_i}}Home{{/i}}</a> <span class="divider">/</span></li>
- <li><a href="#">{{_i}}Library{{/i}}</a> <span class="divider">/</span></li>
+ <li><a href="#">{{_i}}Home{{/i}}</a></li>
+ <li><a href="#">{{_i}}Library{{/i}}</a></li>
<li class="active">{{_i}}Data{{/i}}</li>
</ul>
</pre>
display: inline-block;
text-shadow: 0 1px 0 @white;
}
- .divider {
+ li:after {
+ display: inline-block;
+ content: "\00a0 /"; // Unicode space added since inline-block means non-collapsing white-space
padding: 0 5px;
color: #ccc;
}