Post Formatting issue

[Tom_hampton]

I noticed a formatting issue with the right side-bar. Specifically the Poll. Notice how the text of the post is overlapped by the Poll?

Google Chrome: Version 107.0.5304.107 (Official Build) (64-bit)

OS Name Microsoft Windows 10 Home
Version 10.0.19044 Build 19044
Other OS Description Not Available
OS Manufacturer Microsoft Corporation
System Name SNAKE
System Manufacturer Micro-Star International Co., Ltd.
System Model MS-7B98
System Type x64-based PC

https://forum.slowtwitch.com/forum/Slowtwitch_Forums_C1/Triathlon_Forum_F1/Sweet_Spot_IS_Threshold._You_shouldn’t_train_at_FTP._Change_my_mind.__P7854020/?page=unread#unread

[rrheisler]

It’s the URL creating a run-on through the template.

If you were to delete it and try again it probably would fix itself.

Probably.

[Rappstar]

yeah, we have a URL shortener, but it relies on being able to somewhat identify a URL regex, which certain characters mess up. The :#~: is what threw it.

[Tom_hampton]

Is it caused by something that I did? Because, I don’t think I did anything other than open the thread from the main forum by clicking on the title, as normal. No other threads exhibited that formatting error, though.

Even when I strip the URL to (without the https:):

forum.slowtwitch.com/forum/Slowtwitch_Forums_C1/Triathlon_Forum_F1/Sweet_Spot_IS_Threshold._You_shouldn’t_train_at_FTP._Change_my_mind.__P7854020/

I still see the same overflow on post #1.

If I shrink the browser width down, until the right column goes away, I still have the overflow on post #1:

However, if I continue to reduce the width until the title and the quote|reply cannot fit together, it reflows correctly:

ETA: Incidentally, this very post seems to be having the same issue (again even with the URL stripped of all “#” “?=” tags:

[habbywall]

Both answers above seem to be missing that it’s likely a plain CSS issue. In the screenshot posted by OP you can see the text overlap is not just the extra long link but the entire post body text as well. More than that it’s actually multiple divs breaking through for whatever reason:

the above divs are all breaking out of the properly spaced

, unless there’s something crazy where server side is trying to dynamically set page and div widths or client side js is doing it based content width it shouldn’t have anything to do with that single long url width. Definitely need a true UI/CSS expert to look into why it’s rendering like this, but a quick fix would be for any of the admins here to put a ‘overflow-wrap: anywhere;’ into the css on the right element, which that is I’m not 100% sure, but at a minimum on .post-body should fix it. Adding screenshot for reference, again, definitely not my strong suite and only tested in chrome.

Unless of course there’s some sort of reason for not wanting URLs to wrap or do a more dynamic link shortening thing I’ve seen in some places.