none
Word wrap in text boxes are wrapping in the middle of words and not at spaces in I.E.

    Question

  • In lists where I'm using a custom infopath form word-wrapping is not happening just a spaces in IE. Textarea elements within my form are being assigned the style attribute "white-space:pre" and this causes IE to behave that way. In Firefox the lines are being wrapped sensibly at spaces.

    Can this be changed anywhere in InfoPath or SharePoint? I can't believe everyone is experiencing this. This doesn't happen on rich text fields however - nor in a calculated field that is displaying the same text that my text area is.

    Here's an example: 

    Monday, October 06, 2014 8:36 PM

Answers

  • Hi,

    I tested in IE 11, and I got the same results as you got.

    In addition, I also tested in IE 10 and IE 8, the issue did not occur.

    If you are using IE 11, I recommend to add the code below to the display form page, edit form page and new form page of the InfoPath form:

    <style>
    textarea{
    	white-space: pre-line !important;
    }
    </style>

    After that, the text in text box will break at words.

    Best regards.

    Thanks


    Victoria Xia
    TechNet Community Support


    Thursday, October 09, 2014 1:59 AM
    Moderator
  • Hi,

    You can add the code to the master page of your site, then all the text box in the InfoPath forms in this site will use this style.

    Best regards.

    Thanks


    Victoria Xia
    TechNet Community Support


    Tuesday, October 14, 2014 10:14 AM
    Moderator

All replies

  • Hi,

    I tested the same scenario per your post, however the text displayed fine in the text box in IE 10.

    Which version of IE did you use?

    I recommend to use IE 8 or later version to see if the issue still occurs.

    Best regards.

    Thanks

    Victoria Xia
    TechNet Community Support


    Wednesday, October 08, 2014 4:36 AM
    Moderator
  • I'm using IE 11 - both desktop and Windows 8 versions are showing this. I created a simple HTML page on my desktop and used the following textarea definition - which reproduced the same wrapping behavior in IE 11:

    <textarea style="height: 370px; white-space:pre; ; resize: none;">
    If you're not seeing this, can you check the HTML code produced on the textarea element? I wonder if there's some setting in the InfoPath dev environment or on SharePoint O365 that is causing the style "white-space:pre" setting.

    I'm starting to suspect SharePoint O365... I don't recall this happening on any SP 2010 on-premises sites I used.

    Wednesday, October 08, 2014 5:40 PM
  • Little more info...

    I'm comparing the same InfoPath form in SP 2010 on-premises vs. 2013 O365 and don't understand why 2010 breaks the sentences at words and  2013 does not. I'm looking at the debugger (F12) and they do share the same attributes - "white-space:pre" is being used on 2010 as well, and removing it does NOT change the wrapping behavior as it does on 2013. 

    Pulling my hair out on this one...

    Wednesday, October 08, 2014 7:08 PM
  • Hi,

    I tested in IE 11, and I got the same results as you got.

    In addition, I also tested in IE 10 and IE 8, the issue did not occur.

    If you are using IE 11, I recommend to add the code below to the display form page, edit form page and new form page of the InfoPath form:

    <style>
    textarea{
    	white-space: pre-line !important;
    }
    </style>

    After that, the text in text box will break at words.

    Best regards.

    Thanks


    Victoria Xia
    TechNet Community Support


    Thursday, October 09, 2014 1:59 AM
    Moderator
  • Thanks for the research, Victoria.

    Unfortunately it's not a practical solution. We've too many InfoPath forms used in too many pages.

    I need to find out how to log a bug in SharePoint. It may ultimately be a bug in IE 11, but someone didn't do their full regression testing. 

    Still not sure why it's *not* an issue in SharePoint 2010 with IE 11.

    Thursday, October 09, 2014 3:14 PM
  • Hi,

    You can add the code to the master page of your site, then all the text box in the InfoPath forms in this site will use this style.

    Best regards.

    Thanks


    Victoria Xia
    TechNet Community Support


    Tuesday, October 14, 2014 10:14 AM
    Moderator
  • Hi ,

    can you please confirm which IE version 11.0 with 32 bit or 64 bit you are using. Because Sharepoint 2010 support 64 bit IE 11 with certain limitation. 

    Regards

    Soni K

    Tuesday, October 14, 2014 11:01 AM
  • can you please confirm which IE version 11.0 with 32 bit or 64 bit you are using. Because Sharepoint 2010 support 64 bit IE 11 with certain limitation. 

    Soni K

    I'm using 32bit, but it really shouldn't matter. Something as simple as word-wrap on an default SP2010 site changes behavior on a default SP2013 site. 

    You can add the code to the master page of your site, then all the text box in the InfoPath forms in this site will use this style.

    Victoria Xia

    Thanks, Victoria. I'll probably implement this work-around. It would be nice if there were any easy way to submit this obvious and simple bug to MSFT. Not sure if it's the IE or the SharePoint team that should fix it.

    Tuesday, October 14, 2014 5:50 PM
  • Hi,

    You can open a ticket with Microsoft from the following link:

    http://support.microsoft.com/default.aspx?id=fh;en-us;offerprophone

    Best regards.

    Thanks


    Victoria Xia
    TechNet Community Support

    Friday, October 17, 2014 6:34 AM
    Moderator
  • I have this same issue. When I saved the style code into the masterpage it had no effect on the text wrapping breaking in the middle of a word on my InfoPath forms.

    Thursday, April 30, 2015 11:25 PM
  • I had also ran into this same problem and had posted your code into the master page and it looks like it did fix the problem for IE. Except now I am still having the same problem for other browsers like Chrome. Is there a way to keep this from happening with Chrome as well?
    Monday, February 22, 2016 9:25 PM
  • Yes...add the IE tab for Chrome extension and it will resolve the issue. But thats annoying. I would rather have a solution from Microsoft.

    Tuesday, May 24, 2016 1:39 PM
  • Pasting the code did not work for me. Is there a certain spot to paste it into. I tried the master page as well. What am I doing wrong?
    Tuesday, September 27, 2016 4:36 PM
  • Hi,

    I tested in IE 11, and I got the same results as you got.

    In addition, I also tested in IE 10 and IE 8, the issue did not occur.

    If you are using IE 11, I recommend to add the code below to the display form page, edit form page and new form page of the InfoPath form:

    <style>
    textarea{
    	white-space: pre-line !important;
    }
    </style>

    After that, the text in text box will break at words.

    Best regards.

    Thanks


    Victoria Xia
    TechNet Community Support


    This worked beautifully for me!!In my case I was using a multi-line plain text box using Infopath and the text just did not wrap. I added this to a content editor webpart on the page and it worked like a charm! 
    Friday, April 21, 2017 4:52 PM
  • For best results, add this to a CSS file and link it to your Master page in the <head/> tag.
    Friday, April 21, 2017 4:54 PM