views:

190

answers:

3

I need to make some forms in HTML that a customer will need to print and write some entries by hand then scan or fax.

So I want there to be an area for signing like "Sign ____"

Underscores are all good if the underline is a limited length, but what if I have a number of lines that need to go all the way across the page (or in some cases table cell) with some text in front of each??

So:

Item 1: ____________
An Item 2: _________
This is item 3: ____
1 more item: _______

The trouble is if I use underscores, the underscores don't finish at the same places and it looks wrong or it warps the size of the cell. The best thing would be to underline white space but that's just not possible.

+1  A: 

Wrap it in <pre> tags </pre>.

It will use a monospaced font so your underscore 'lines' will end at the same position. You may have noticed this also happens in your question above ;-)

ChristopheD
yes I did notice :)
Grym
+5  A: 

So build some block elements with a border-bottom. Those will look like underlines and you can play with colors, thicknesses and whatnot.

A pragmatic solution: I would make each line a 2-column table, give the left column (with the text) a width of 0% (which will expand to the minimum needed) and the right column (empty with underline) a width of 100% (which will take up the remaining space); and I'd put an empty block with a bottom border into that right table cell.

This design of mine violates some ideals held by many other Web designers. I'm not saying this is a fantastic or very standards-compliant design, I only claim it's simple and it works.

Carl Smotricz
If tables can be useful in a situation like this, then they can't all be evil, right?
Michael Itzoe
I keep getting into fights with CSS purists about this. I try to stay out of the argument, I just trot out my approach and let the question askers decide which they prefer.
Carl Smotricz
A: 

Try using a CSS rule like

text-decoration: underline;

or

border-bottom: 1px solid black;
Jimmy Baker
You wanna take the `l` out of "decoration" ;)
Carl Smotricz