Site icon Divi Notes

Stop Text Wrapping in the Middle of a Word or String

photo of a wrapper with a microphone

A while back, I encountered a situation where a word in some title text was breaking mid-word on mobile screens. A simple solution to this problem is to use the <wbr> HTML tag. The purpose of the <wbr> tag is to tell the browser at what point in a word or sentence it is best to shift to a new line.

How to use the <wbr> HTML Tag

Simply place the tag where you would like the browser to break the sentence or word onto a new line. This could be handy for very long words or for long strings of text like URLs or file paths.

Done

Well, this isn’t earth-shattering stuff but who knows, you might find it useful at some point.

Happy web designing and developing.




Divi Notes started as a way to document my own WordPress and Divi web design/development journey and, to my delight, has grown to become a helpful resource to many other Divi users out there. If you’ve found Divi Notes to be useful in your journey, I’d appreciate it if you would consider supporting me using the form below.

$
Select Payment Method
Personal Info

Donation Total: $4.99