Forum Discussion
Wrap breaking words
Micraf Try using combination of white-space , word-wrap and word-break which suits your requirements.
I noticed sp-card-subcontainer class is using word-break: break-all which might be causing this problem. Try using other values for this property and see which one works for you.
Please click Mark as Best Response & Like if my post helped you to solve your issue. This will help others to find the correct solution easily. It also closes the item. If the post was useful in other ways, please consider giving it Like.
If I take out the Div for the sp-card-subcontainer the words wrap correctly so I think it may have something to do with this????
But, by leaving this out the view no longer has the border around each item.
Anyone have any thoughts on this?
Micraf Try using combination of white-space , word-wrap and word-break which suits your requirements.
I noticed sp-card-subcontainer class is using word-break: break-all which might be causing this problem. Try using other values for this property and see which one works for you.
Please click Mark as Best Response & Like if my post helped you to solve your issue. This will help others to find the correct solution easily. It also closes the item. If the post was useful in other ways, please consider giving it Like.
- Thanks ganeshsanap
I will try your suggestions and come back to you. How did you know the sp-card-subcontainer is using word-break: break-all?
Also, along the lines of my other post you replied to, where do I find the valid parameters for word-break?
Thanks.- ganeshsanap
Thanks mate - worked a treat. I added the style "word-break":"normal" after the after the subcontainer class. See below.
Thanks again.
"elmType": "div",
"attributes": {
"class": "ms-bgColor-white sp-css-borderColor-neutralLight sp-card-borderHighlight sp-card-subContainer"
},
"style":{
"word-break":"normal"
},Micraf Great, glad it worked for you!
I checked the CSS for sp-card-subContainer class from browser's developer tools & noticed the word-break: break-all property.
Please consider giving a Like if my post helped you in any way.