Leader Dots

Just CSS

by westy808

HTML

<ul class="leaders">
	<li><span>Item</span><span>12.234</span></li>
	<li><span>Another Item</span><span>1,000.25</span></li>
</ul>

CSS

ul.leaders li { clear: both; }

ul.leaders li span:first-child {
	float: left;
	padding: 0 .4em 0 0;
	margin: 0;
}
ul.leaders li span + span {
	float: right;
	padding: 0 0 0 .4em;
	margin: 0;
}

ul.leaders li:after {
	content: "";
	display: block;
	overflow: hidden;
	height: 1em;
	border-bottom: 1px dotted;
}