PW James - 22 February 2010 03:45 PM

The following code displays a textarea with an image in the bottom-right corner. However, it doesn’t stay put when the user begins scrolling up and down the field.

<textarea cols="75" rows="7" style="width: 95%; height: 100px;" name="message" tabindex="1" style="background: url(image.png) no-repeat;background-position:right bottom;"></textarea> 

So after searching the web for a solution, I added a “background-attachment:fixed” property, as shown here:

<textarea cols="75" rows="7" style="width: 95%; height: 100px;" name="message" tabindex="1" style="background: url(image.png) no-repeat;background-position:right bottom;background-attachment:fixed;"></textarea> 

But now the image doesn’t display at all!

Anyone know where I’m going wrong? Apart from using Internet Explorer 7 of course… (I haven’t been able to test in other browsers yet.) Any advice appreciated.

Maybe you can fix it using nested DIVs.

<div style=“width: 970px;margin: 0 auto;position:relative;”>
  <div id=“apDiv1”>
  ....
  ...
  ...
</div>
</div>

Thx,.. its really works for me i try on my my website on Portable Generators

Excellent post. I want to thank you for this informative read, I really appreciate sharing this great post. Keep up your work
Austin Homes For Sale