Question

Interesting one, this. I have the following JS code, which I’m displaying in a textarea.

var drinks = ['coffee', 'tea', 'Ribena', 'Vimto', 'ginger beer', 'hot chocolate'];

Where wrapping is required, IE breaks BEFORE the first square bracket (i.e. the start of the array, but the actual JS code isn’t important here), whereas other browsers break WITHIN the square brackets.

The latter seems correct, since there are spaces (i.e. breakable points) within the square brackets.

There is no funky word-wrap or white-space CSS going on. Is there anything I can do about this?

Answer 1

There are several characters -()[]{}«»%°·/!? that Internet Explorer automatically interprets as a line break. You have kind of a special situation in that you are trying to make this work inside of a textarea since you can’t render HTML within the tag.

In theory, you could do something like:

<textarea><nobr>var drinks = ['coffee', 'tea', 'Ribena'];</nobr></textarea>

and IE would not automatically break at characters such as the [ as noted by your example. Except, you obviously can’t use the html tag inside of a textarea so this just isn’t possible.

As an alternative, if you are seeking one, might you try using a scrollable div instead of a text area for this situation?