2

Vf code

  <style type='text/css'>

       #tooltip {
position: relative;    
}
#tooltip .tooltiptext {
    visibility: hidden; position: absolute; z-index: 1;position: absolute;background: #FFFFFF; width: 11em;border: 1px solid #000000;overflow-wrap: break-word; word-break:break-all; background-size: cover; color: #000000; padding: 0 5px; height: auto; left: 50px; top: -10px
    }    
#tooltip:hover .tooltiptext {
    visibility: visible;word-wrap:break-word; overflow-wrap: break-word;

    }
 </style>


   <th id="tooltip">plz hover<span class="tooltiptext">{!stats.Key_Highlights__c}</span></th>

Problem: I am unable to wrap text in the block.

Any solution for this?

3 Answers 3

7

Adding white-space: normal appears to fix it:

#tooltip:hover .tooltiptext {
    white-space: normal;
    visibility: visible;
    word-wrap:break-word;
    overflow-wrap: break-word; 
}

In plain HTML white-space: normal is the default for table and inherited by your span but in Visualforce Classic CSS this is missing so you have to add it to your span.

0
1

Quoting Aruns resource:

Long strings of adjoining characters do not word wrap in Text Fields

Description

When placing a URL or other long string of characters into a text field, it cannot break up the characters in the same way as a word processing program. It maintains the integrity of the "word" so as to avoid confusion for the reader. This causes the field to expand, stretching past the boundaries of the page and causing unusual behavior for the record, making it appear "broken."

This generally goes unnoticed, as Users input sentences or single words into the fields. The spaces provide the necessary break for the text field to utilize and the text is wrapped normally. Check out our recommended best practices for text fields, below. Resolution

Text Field Best Practices

  • Shorten URLs.
  • Use spaces.
  • Try a hyphen or other characters that provide the necessary breaks in text.

Quick tip: The underscore doesn't work the same way as a hyphen, so using one will not break-up your text.

-1

Also,

Salesforce does NOT support this issue. Please check the below link for reference.

Long strings of adjoining characters do not word wrap in Text Fields

1
  • 2
    If your are going to link to a resource, please quote the relevant content here.
    – Adrian Larson
    Jan 28, 2017 at 17:13

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .