Is there a way to wrap text inside Spreadsheet widget so that words are kept on one line or another and not broken?

  • saltadministration
    Asked on February 25, 2016 at 6:04 AM
    Is there a way to wrap text so that words are kept on one line or another and not broken into?  I found the custom css (with your wonderful forum) to create text wrap, but it will break a word into when it runs out of room.
  • Boris
    Replied on February 25, 2016 at 6:30 AM

    I see that you are using the following custom CSS in your spreadsheet widget:

    .A input { width: 50px; min-height: 80px; word-break : break-word; }
    .B input { width: 90px; min-height: 80px; word-break : break-word; }
    .C input { width: 180px; min-height: 80px; word-break : break-word;}
    .D input { width: 220px; min-height: 80px; word-break : break-word;}
    td, th {
    word-break : break-word;
    }

    The word-wrap:break-word CSS is for allowing a word to be broken at any point of the word in order to allow wrapping.

    However, you are applying this CSS to input fields that are built to be single-line inputs. When your users are typing their data into the widget, it will remain on one line in most browsers! Google Chrome and other webkit based browsers allow the singly line input field to appear as if it were multiline by using the word-break CSS, but it works only in those browsers, and the required CSS forces the words to break at any point.

    In Firefox and Internet Explorer, your users will still see everything in only one line:

    Is there a way to wrap text inside Spreadsheet widget so that words are kept on one line or another and not broken? Image 1 Screenshot 20

    If you are looking for a cross browser way to make the single line input fields appear as multiline, and therefore allow word wrapping, I'm afraid that it is simply not possible at this time. The technology is built as such that only textarea elements were designed to be multiline, and our Spreadsheet widget is built to use regular input elements.

    I hope this helps.