Before using it, I tried manually entering periods, but that still left text ragged and unaligned, plus its not very elegant. Good call with using dl instead of ul tags. I've taken out the width properties and replaced it with overflow: hidden for my liquid layout: http://cdpn.io/DHcnr
I'm building a price menu and wanted to link the service with a price using ellipsis (like this).
I am using an unordered list with a text-align: right
Service..................$99
Service-Deluxe....$7
Service-Basic.......$11
Is there a jQuery plug-in for something like this? Or should I just manually add periods within the HTML? Thanks!
Just a little bit hacky: http://codepen.io/CrocoDillon/pen/phdxA :)
Using JavaScript or php or manually add the dots would be much better, but would work best with a monospace font.
Here's a similar method using a dl and a pseudo element (in the past I've used background images - still may).
http://codepen.io/wolfcry911/pen/kaluI
I like yours better, because it uses the actual dots from the font used.
Thanks. For the record, I wasn't implying that my way was better - I just like showing alternatives.
Of course, I'd do the same :)
Thanks @wolfcry911, I like your method.
Before using it, I tried manually entering periods, but that still left text ragged and unaligned, plus its not very elegant. Good call with using dl instead of ul tags. I've taken out the width properties and replaced it with overflow: hidden for my liquid layout: http://cdpn.io/DHcnr
Continued on new thread, Price Menu Ellipsis 2 (http://css-tricks.com/forums/discussion/23548/price-menu-ellipsis-2#Item_1)