AJAX TextBoxWatermarkExtender causes widening of textbox it is attached to.

Question

Hello.

Here's is the issue testcase. I have some textboxes (multiline, wrap=true) with watermark extenders attached.

then I type a short world, then space, then long word (like 'short longgggggggggggggggggggggggggggggggggggggggg' that consumes more than line so that scrollbar appears)

whenever I set focus to to another textbox, then set it back to watermarked textbox, the last gets widening spontaneously making all the page looking ugly.

The issue occurs in IE only, Firefox performs the same OK.

Not-watermarked textboxes and watermarked but disabled ones (property "enabled=false") also behaves OK.

Google keeps silence about this issue, I haven't found even vague tips. Obviously something wrong with AJAX javascript, but how to fix it? Are there solutions but getting rid of watermarks?

Does anybody know?

thanks.

Answer 1

Initially, I encountered the problem as well and no obvious fixes in sight. The problem does appear to be CSS related.

In my instance I had something like the following pseudocode.

<td>
    <asp:textbox id="tbDescription" multiline="true" cssClass="tbMultiline" ..other attributes excluded for brevity />
    <asptoolkit:TextboxWatermarkExtender targetControlId="tbDescription" WatermarkCSS="tbMultilineWatermark" message="blah blah blah" ..other attributes excluded.../>
</td>

both css classes specified a width of 100%. However, the bounding TD did not have a fixed width and so it would exhibit the widening behaviour you saw.

I fixed the problem by forcing the width to a fixed %.