[Last Call] Learn how to a build a cloud-first strategyRegister Now

  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 2148
  • Last Modified:

Fixed width div/textarea with no scroll bars needs to expand to content

Hi Experts,

 I have some dynamic text content that I need to echo. I want it to fill a space 580px in width. Should the content exceed 580 it needs to wrap and expand either the div or the texarea. I have got this to work using a textarea and wrap="virtual' in Safari but it produces on long line of text and a scroll bar in FF and IE.
I have tried max-width but that only works in Saf too.
Is this possible? It seems basic but i can't seem to find an example that works in the knowledge base.

Thanks for any help.
  • 2
1 Solution
This is what someone else posted on here.



function MakeSizeAdjustment(oTextArea)
      if (navigator.appName.indexOf("Microsoft Internet Explorer") == 0)

      while (oTextArea.scrollHeight > oTextArea.offsetHeight)



The amazing, incredible, expanding text-area:
<textarea style="overflow:visible;width:30%" rows="3" onkeyup="MakeSizeAdjustment(this)">Some Test Text</textarea>

RowdyBurnsAuthor Commented:
EEErm. This still displays scroll bars in FF.
DIVS and text areas will ALWAYS show scroll bars if the content exceeds the DIV height -- with DIVs you can elminate the scroll bars with --

DIV {scroll-y:no; scroll-x:no;}

with text area, you cannot solve this.  Why not just use a table?  If the user can't edit the content, just put it in a table and the table cell will automatically fill the table and wrap correctly without ANY scroll bars --

<TABLE width="580">
     <TD width="580"> content here </TD>

that is guaranteed to work, no matter how big the content is.
RowdyBurnsAuthor Commented:
Thank you for having a look at this.

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now