Can't implement word break in the Text component from polaris.

Can't implement word break in the Text component from polaris.

Wakil_eFoli
Shopify Partner
45 2 5

 

Here is my component:

<div className="width-preview-textarea">
  <Text as="span" variant="bodyMd" breakWord={true} truncate>
    <pre>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</pre>
  </Text>
</div>

 

And here is the css I'm applying: 

.width-preview-textarea {
  max-width: 274px;
  color: brown;
  word-wrap: break-word;
  white-space: pre-wrap;
  word-break: break-word;
}

 

No matter what I do I can't make it work.

So if you could help it would be greatly appreciated. Thanks

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Replies 0 (0)