Menu style “…” - fill in with periods

Question

I have been trying to find the best way to create the \".....\" effect like in a dinner menu: http://cl.ly/0g263j04322m3F140D40

Not sure if it has to be done with ju

Answer 1

Try this CSS2 solution.

HTML:

 
    
Soup€ 2.99
    
Ice cream€ 5.99
    
Steak€ 20.99

CSS:

ul {
    width: 400px;
    list-style: none;
}
li {
    border-bottom: 2px dotted black;
    height: 20px;
    margin-bottom: 6px;
}
li span {
    position: relative;
    top: 6px;
    float: left;
    clear: right;
    background: white;
    height: 26px;
}
li span+span {
    float: right;
}