Overlaying captions on input fields

I have designed a form whereby the bottom right hand corner of each
field is overlayed with text that act as a caption for the field. As
an example see the background labels in this article
http://www.microsoft.com/mind/0299/forms/forms.asp

My styling is a variation of that put forth in the article and is
based on absolute positioning.

However I am looking for a generic solution that will maintain the
effect for different sizes of fields and if the field is dynamically
resized.

A few spring to mind... dynamic properties, scripting but I am not
sure where to start or what the most apt approach would be.

Appreciate some guidance, hints etc.

"wooks" <wookiz (AT) hotmail (DOT) com> wrote

I have designed a form whereby the bottom right hand corner of each
field is overlayed with text that act as a caption for the field. As
an example see the background labels in this article
http://www.microsoft.com/mind/0299/forms/forms.asp

My styling is a variation of that put forth in the article and is
based on absolute positioning.

However I am looking for a generic solution that will maintain the
effect for different sizes of fields and if the field is dynamically
resized.

A few spring to mind... dynamic properties, scripting but I am not
sure where to start or what the most apt approach would be.

Appreciate some guidance, hints etc.

Have you tried making each input field a block and positioning the label as
absolute with side offsets to keep it in the bottom right?

G

George King wrote:

"wooks" <wookiz (AT) hotmail (DOT) com> wrote in message
news:8852d33c.0412040015.6521cf64 (AT) posting (DOT) google.com...
I have designed a form whereby the bottom right hand corner of each
field is overlayed with text that act as a caption for the field.
As
an example see the background labels in this article
http://www.microsoft.com/mind/0299/forms/forms.asp

My styling is a variation of that put forth in the article and is
based on absolute positioning.

However I am looking for a generic solution that will maintain the
effect for different sizes of fields and if the field is
dynamically
resized.

A few spring to mind... dynamic properties, scripting but I am not
sure where to start or what the most apt approach would be.

Appreciate some guidance, hints etc.

Have you tried making each input field a block and positioning the
label as
absolute with side offsets to keep it in the bottom right?

G

What I have done is somewhat similar - defining the width of the label
to be the same as it's container and overlaying it using absolute
positioning with the text right-aligned.

If the height of the containing input field is changed however, the
caption will no longer be bottom-right.

The nearest I've got conceptually is some dynamic property where the
padding-top of the caption is related to the height of the container so
that as it's height is increased the caption is pushed down and kept on
the bottom line.

I'm just wondering whether that is the most generic solution.

This is all on IE6 btw and aside from IE5 is not targeted at any other
browser.