1 Another great article

Great article, Mike! Although it has some problems with the password field in FireFox 2.0

posted at 09:10 am on December 19, 2006 by Dimitar Yanev

2 Great Article

Very useful and it works great.
RE: Comment #1, What problems does it have?

posted at 09:52 am on December 19, 2006 by Steven J. Strutt

3 Firefox 2 Issue

In Firefox 2 (OS X), the password field isn’t rendering properly. It simply shows a password field with asterisks “********”

posted at 10:21 am on December 19, 2006 by ian heggaton

4 No Javascript Error

If you turn off JavaScript the labels remain in place over the fields causing an overtype effect. Wouldn’t it be a better solution to set the position of the labels using a JS function or even use JS to:

a. Hide the labels and…
b. Determine the text for each label, and finally…
c. Use that text as the default value for the appropriate field?

posted at 10:32 am on December 19, 2006 by Sean Foushee

5 The value of the password field

Where do you set the value of the pasword field to be “password”, and how ??

posted at 11:15 am on December 19, 2006 by Sebastian Dammark

6 Why nog use the default value instead?

It’s a great concept, but I do agree with Sean: wouldn’t it be much easier (and probably safer) to just get the value of the associated label and set this as a default value vor hte input field? I’m not sure about using CSS and the overlay technique for this.

posted at 12:01 pm on December 19, 2006 by Roel Van Gils

7 Is this design pattern usable?

Great technique and works on Windows (some issues apparently on OSX) but in my opinion should designers be using this pattern to design forms in the first place? It would always be more usable to provide the label above the field if there is horizontal restriction of space, if the space is restricted vertically, use a horizontal layout. If it is a really small screen, use the first option with a scroll. Why resort to this?

posted at 12:01 pm on December 19, 2006 by Navneet Nair

8 No Javascript and Default values

Sean is right that turning off JavaScript would break this. But the proposed solution doesn’t work – you can’t present a default value in the password input (without changing it’s type).

But using this concept, you’d better add the overlabel class to the labels with Javascript.

posted at 12:08 pm on December 19, 2006 by Daniel Sandbecker

9 Untitled

Is there any reason you’re giving the divs their own ids? They all seem to perform the same functionality in the CSS so can’t you just use them as a container with no id and no class and reference them from within the form id, i.e. #formname div.

Sorry if I’ve missed something, it would just seem to clean up the CSS and markup a lot that way?

posted at 01:14 pm on December 19, 2006 by Paul Solecki

10 Untitled

..and then he notices the submit div being different. But still most divs will be exactly the same and you could just override this one as necessary?

posted at 01:15 pm on December 19, 2006 by Paul Solecki