cancel
Showing results for 
Search instead for 
Did you mean: 

View formatting issue

Anonymous
Not applicable

View formatting issue

I'm seeing this when it wasn't there the last time I viewed the site about 45 mins ago! Any thoughts?

Oops!

This is with all thread not just the one shown using this URL:

https://community.plus.net/t5/forums/unreadpostspage/tab/message:full

17 REPLIES 17
jab1
Legend
Posts: 16,815
Thanks: 5,339
Fixes: 248
Registered: ‎24-02-2012

Re: View formatting issue

Not much help, I know, but I don't have this problem in a 15" laptop. Huh

John
Browni
Aspiring Hero
Posts: 2,673
Thanks: 1,054
Fixes: 60
Registered: ‎02-03-2016

Re: View formatting issue

I did see the problem when the post you have shown was unread, but now I've read it it doesn't show!
Anonymous
Not applicable

Re: View formatting issue

I don't think it is related to screen size but it could be depending on the CSS which is where I think the issue it. I'm on a 27" iMac running at 5120 x 2880 and I still see it even after a full refresh of the page.

 

jaread83
Community Gaffer
Community Gaffer
Posts: 3,438
Thanks: 2,336
Fixes: 81
Registered: ‎22-02-2016

Re: View formatting issue

Its because the characters being used as a seperator is being seen as a single word by your browser. Default CSS on <p> tags doesn't have word-break: break-all; applied to it because you don't want to break single words onto a new line if there isn't space, it will look for the next place where the word ends and flow the text to the next line at that point.

Not much I can do about that unless I set the word-break to make words that reach the end of the line go to a new line... which is not desirable. This is how all browsers treat this type of content.

https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_paragraphs2

Add a long line of the same character without spaces and click 'run' - notice that you will now get a horizontal scroll bar, default browser behaviour.

Frontend Web Developer | www.plus.net

If you have an idea to improve the community, create a new topic on our Community Feedback board to start a discussion about your idea.

Anonymous
Not applicable

Re: View formatting issue

@jaread83 - Thanks, but why has this suddenly become an issue as I said in the OP it wasn't there 45 minutes before I posted and my browser hasn't changed either! For what it's worth I'm running FF 54.0.1 (but an update is available) on OSX Sierra v10.12.5.

Viewing the URL with Safari produces the correct results!

 

jab1
Legend
Posts: 16,815
Thanks: 5,339
Fixes: 248
Registered: ‎24-02-2012

Re: View formatting issue

Probably a silly question, but does it happen on other forums (using Lithium), such as the TalkTalk one?

John
jaread83
Community Gaffer
Community Gaffer
Posts: 3,438
Thanks: 2,336
Fixes: 81
Registered: ‎22-02-2016

Re: View formatting issue

Very strange @Anonymous. I guess it depends how the browser but I found an article about it here: https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/
@jab1, I have checked a few others and it varies on results. One community I checked the word-break CSS has been applied but then on another it hasn't and it produced the same results we are seeing here.
I am pushing an update tomorrow morning with some bits and bobs (will let you all know what exactly before then), leave this with me and I will see if I can get an extra fix into the release.

Frontend Web Developer | www.plus.net

If you have an idea to improve the community, create a new topic on our Community Feedback board to start a discussion about your idea.

Browni
Aspiring Hero
Posts: 2,673
Thanks: 1,054
Fixes: 60
Registered: ‎02-03-2016

Re: View formatting issue

If I view the thread directly this is how it shows

2017-08-17.PNG

It's only broken when using the link in post #1

eta: I'm using Palemoon x64
jaread83
Community Gaffer
Community Gaffer
Posts: 3,438
Thanks: 2,336
Fixes: 81
Registered: ‎22-02-2016

Re: View formatting issue

Its because the table has a class of 'lia-data-cell-primary' and the CSS is set to word-break: normal; This treats all text within it like normal text.
I have just applied a fix on our staging site - just going to copy and paste the post to test it now on the unread page over there.

Frontend Web Developer | www.plus.net

If you have an idea to improve the community, create a new topic on our Community Feedback board to start a discussion about your idea.

Anonymous
Not applicable

Re: View formatting issue

Viewing the thread @Browni I get the same it was only visible on the 'view' I posted in the OP, having said that, I marked those messages as read and on arrival now everything is now as it should be. Most weird, maybe there's no need to do anything @jaread83 but I will make an update if this returns. I'm just confused as to why it happened.

 

Browni
Aspiring Hero
Posts: 2,673
Thanks: 1,054
Fixes: 60
Registered: ‎02-03-2016

Re: View formatting issue

@Anonymous I did say I saw the same issue as you when the post was unread, marking the thread as new lets me recreate the issue.

Anonymous
Not applicable

Re: View formatting issue

Yes, I saw that thanks, so edited my post.

jaread83
Community Gaffer
Community Gaffer
Posts: 3,438
Thanks: 2,336
Fixes: 81
Registered: ‎22-02-2016

Re: View formatting issue

I have fixed this and will be live tomorrow morning. Below is a screenshot of how a post like this would render from now on.

Screen Shot 2017-08-17 at 14.42.26.png

Frontend Web Developer | www.plus.net

If you have an idea to improve the community, create a new topic on our Community Feedback board to start a discussion about your idea.

Browni
Aspiring Hero
Posts: 2,673
Thanks: 1,054
Fixes: 60
Registered: ‎02-03-2016

Re: View formatting issue

It's not peculiar to that thread either as this shows

2017-08-17a.PNG