# Possible bug with text wrapping. Am i doing something wrong?

**URL:** <https://community.weweb.io/t/possible-bug-with-text-wrapping-am-i-doing-something-wrong/2540>\
**Category:** Ask us anything\
**Created:** [May 2, 2023, 3:44pm UTC](https://community.weweb.io/t/possible-bug-with-text-wrapping-am-i-doing-something-wrong/2540 "2023-05-02T15:44:30Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![jaredgibb](https://avatars.discourse-cdn.com/v4/letter/j/ecd19e/32.png) [@jaredgibb](https://community.weweb.io/u/jaredgibb)\
**Post date:** [May 2, 2023, 3:44pm UTC](https://community.weweb.io/t/possible-bug-with-text-wrapping-am-i-doing-something-wrong/2540/1 "2023-05-02T15:44:30Z")

</div>

I am trying to wrap a tex (a long URL) within a column BUT the text wrapping doesn’t wrap in appropriate places, instead only at hyphens or spaces. This results in texts being wider than a column that the text is placed in. Is there a way around this. Even when explicitly setting a width, the wrapping is not working correctly. Please see the issue in the video

---

<div class="post-metadata">

**Author:** ![dorilama](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/dorilama/32/10403_2.png) [@dorilama](https://community.weweb.io/u/dorilama)\
**Post date:** [May 2, 2023, 4:26pm UTC](https://community.weweb.io/t/possible-bug-with-text-wrapping-am-i-doing-something-wrong/2540/2 "2023-05-02T16:26:24Z")

</div>

you can try to add `overflow-wrap: break-word` in the custom css of the element (at the bottom of the style panel)  
 ![image](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/d/d888ad663a13ea1fdf4ea58c85b5980f6b169a37.png)

remember to set a width for the text element

---

<div class="post-metadata">

**Author:** ![MichaelLovell](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/michaellovell/32/2157_2.png) [@MichaelLovell](https://community.weweb.io/u/MichaelLovell)\
**Post date:** [May 4, 2023, 9:50pm UTC](https://community.weweb.io/t/possible-bug-with-text-wrapping-am-i-doing-something-wrong/2540/3 "2023-05-04T21:50:08Z")

</div>

Do you really want a URL that spans 5 lines?

Set a width on the text field, and then add ‘No-wrap’ and ‘Ellipsis’ to **On**

 ![image](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/4/4b4f9a52c316c05ef05a0ddc74003e6360f9722a.png)

---

<div class="post-metadata">

**Author:** ![jaredgibb](https://avatars.discourse-cdn.com/v4/letter/j/ecd19e/32.png) [@jaredgibb](https://community.weweb.io/u/jaredgibb)\
**Post date:** [May 4, 2023, 11:36pm UTC](https://community.weweb.io/t/possible-bug-with-text-wrapping-am-i-doing-something-wrong/2540/4 "2023-05-04T23:36:15Z")

</div>

> [@MichaelLovell](#):
>
> Do you really want a URL that spans 5 lines

Unfortunately i really do, hence the attempt. It’s just weird how the breaking occurs

It’s a UX thing.

---

<div class="post-metadata">

**Author:** ![MichaelLovell](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/michaellovell/32/2157_2.png) [@MichaelLovell](https://community.weweb.io/u/MichaelLovell)\
**Post date:** [May 5, 2023, 12:06am UTC](https://community.weweb.io/t/possible-bug-with-text-wrapping-am-i-doing-something-wrong/2540/5 "2023-05-05T00:06:21Z")

</div>

Fair enough.

I personally need a masterclass in dynamically sizing elements and ensuring elements don’t overflow when nested inside each other. Its easily one of biggest time traps for me at the moment.

It would be intuitive to think if a child element is place inside a parent element, by default the child elements contents stay within the boundary of the parent element. I’m obviously overlooking some simple principles.

@Joyce tagging you for a potential tutorial on this topic?

---

<div class="post-metadata">

**Author:** ![ou.side](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/ou.side/32/2586_2.png) [@ou.side](https://community.weweb.io/u/ou.side)\
**Post date:** [February 4, 2025, 8:36am UTC](https://community.weweb.io/t/possible-bug-with-text-wrapping-am-i-doing-something-wrong/2540/6 "2025-02-04T08:36:53Z")

</div>

word-break: break-all;

overflow-wrap: anywhere;

white-space: normal;

display: inline-block;

and set a max-width:100% for the text element
