jyushinx
07-16-2007, 09:07 AM
Hi,
I'm working on a website for a restaurant. On the menu section, the format is as such: In the first column is the dish name followed by a description (in a span) and then the price in the next column. What I want to do is put a div or a span (whatever would work) after the description and have it automatically stretch from the end of the description to the price column. I would then put a border on the bottom as dots so it has this effect:
Hamburger Delicious .............. $4.95
The HTML would look something like this:
<td>Hamburger<span>Delicious</span><div style="border-bottom:1px black;width:100%"></div><td>$4.95</td>
The problem is that a div automatically displays on the next line. If I set the display to inline, then I can't set the width.
Using a column instead of a div/span will not work, since the names of the dishes vary greatly and a column will only be as small as the largest dish name.
Any ideas for a solution?
Thanks.
I'm working on a website for a restaurant. On the menu section, the format is as such: In the first column is the dish name followed by a description (in a span) and then the price in the next column. What I want to do is put a div or a span (whatever would work) after the description and have it automatically stretch from the end of the description to the price column. I would then put a border on the bottom as dots so it has this effect:
Hamburger Delicious .............. $4.95
The HTML would look something like this:
<td>Hamburger<span>Delicious</span><div style="border-bottom:1px black;width:100%"></div><td>$4.95</td>
The problem is that a div automatically displays on the next line. If I set the display to inline, then I can't set the width.
Using a column instead of a div/span will not work, since the names of the dishes vary greatly and a column will only be as small as the largest dish name.
Any ideas for a solution?
Thanks.