Back to updates
Feature
Designer

Text wrapping and Word breaking now supported

Control exactly where your text breaks into a new line.

Text wrapping and Word breaking now supported

<p id="">Word breaking (the “word-break” CSS property) and text wrapping (the “overflow-wrap” CSS property) are the two latest CSS properties now supported in the Webflow Designer, allowing for more flexibility and control in how text is displayed on any page.</p><p id="">By default, text is only broken at natural breaking points such as spaces.</p><p id="">With word breaking, you can allow for <em id="">every</em> word to break when they hit the edge of their parent div.&nbsp;</p><p id="">With text wrapping, you can allow for words that are too long to fit on their own line (for example, URLs or file paths) to break onto a new line. Additionally, the <em id="">anywhere </em>value is useful when working with non-latin languages.</p><p id="">You’ll find both of these under <strong id="">More type options</strong> in the Typography section of the Style panel.</p><p id="">‍</p><figure id="" class="w-richtext-figure-type-image w-richtext-align-center" data-rt-type="image" data-rt-align="center" data-rt-max-width=""><div id=""><img src="<https://cdn.prod.website-files.com/64f9399ca7d13575ff21a675/64f9399ca7d13575ff21d68fxY06oSNv6-JaXgElzHZiiTSCBcESY1qhib7IFN70-MOZrmOZ5080mjnIcOiiN2SuTovX47h1fIDVZzPf2DIwTOR4853eGi1Ces5s4RBqLTvQkG8LBMnuvnbCIEh0r7Idh5iaKcnN_Y8OUjsuJyz9OM.png>" id="" width="auto" height="auto" loading="auto"></div><figcaption>Text wrapping and Word breaking now supported</figcaption></figure><p id="">To learn more about how these new properties work and how to use them in Webflow, <a href="<https://university.webflow.com/lesson/control-text-wrapping-and-line-breaking>">check out our article on Webflow University</a>.</p>


Launched on
July 14, 2023
Category
Designer

Related updates

Custom tooltips for component props

Custom tooltips for component props

Learn more
Shared Libraries available on all paid Workspace plans

Shared Libraries available on all paid Workspace plans

Learn more
Introducing Webflow Interactions, powered by GSAP

Introducing Webflow Interactions, powered by GSAP

Learn more
Rename elements and component instances

Rename elements and component instances

Learn more
Advanced variables with functions

Advanced variables with functions

Learn more
See recently modified classes in the style selector

See recently modified classes in the style selector

Learn more