Page margin

What do you want to see here? Some more categories, forums, and mods? Hmm...
*16
Core Dumper
Posts: 173
Joined: Wed Jun 02, 2010 12:59 pm

Page margin

Post by *16 »

On some pages the left and right margin disappears and messages ignore the right margin which leads to horizontal scrolling. An example below of different pages in the same topic. (Using Safari 8.0.3)

I don't think this behaviour is wanted, it's not really important, but I was just wondering if it could be fixed easily. If not: ignore this.
Attachments
Page 1 of a topic
Page 1 of a topic
Page 6 of the same topic.
Page 6 of the same topic.
Image

Durf
Match Winner
Posts: 426
Joined: Mon Jul 30, 2012 10:35 pm

Re: Page margin

Post by Durf »

Which topic? I'll see if I can replicate the issue and see what's going on. (probably something outdated)

Seems like a very easy thing to fix if you ask me.

I suspect the contents of a post are affecting the page structure or perhaps that some CSS rule isn't being caught by your browser (or has a different interpretation).



Curious that it happens only on certain pages; lemme know which ones and I'll look into it. :wink:

*16
Core Dumper
Posts: 173
Joined: Wed Jun 02, 2010 12:59 pm

Re: Page margin

Post by *16 »

Durf wrote:Which topic? I'll see if I can replicate the issue and see what's going on. (probably something outdated)

Seems like a very easy thing to fix if you ask me.

I suspect the contents of a post are affecting the page structure or perhaps that some CSS rule isn't being caught by your browser (or has a different interpretation).



Curious that it happens only on certain pages; lemme know which ones and I'll look into it. :wink:
Like I said it's in Safari, it can also be browser based.

It seems like a very awful thing to look for in the css.

The screenshots came from the 'Open Letter to you, Durf' Topic in Really General I think.
Image

Durf
Match Winner
Posts: 426
Joined: Mon Jul 30, 2012 10:35 pm

Re: Page margin

Post by Durf »

Yea, well I'm in chrome and it doesn't happen. So you're right, it IS browser based.
However, each browser tends to interpret CSS in their own way (safari and chrome actually both use webkit), so I suspect that there is something in the CSS (or perhaps an object posted, like a gif attachment) that gets misinterpreted for safari only.

Really, I wish it was happening on my computer (I haven't been able to install and test this on safari myself).
Which version of safari are you using? (help > about) I'd like to get the same version running so I can better test it.


And if you feel like trying to look into it yourself before I get a chance to, first thing I would do is:
Open the problem pages (one problem page, one working page) EACH in 2 different browsers (one being safari, the other being one that works).
Then checking "developer tools" to see if the console outputted any errors (the easy part). If there are errors, let us know and we can go from there.
Otherwise, it would mean having to go through each element, and seeing the applied CSS, tracking it back to the source file (where the css comes from).
There is a chance that it is just an outdated browser (in which case, update it), or something specific that is unsupported by safari (slim chance).

Anyway, sorry I wasn't able to test this / I will look into it when I get the chance to get safari on this comp.
But it's not like the page content (posts and such) get ruined...so it's not too big of a problem.
Still weird that it even happens though.

User avatar
Nanu Nanu
Core Dumper
Posts: 179
Joined: Wed Jul 27, 2011 3:20 am
Location: Witty comment about location here

Re: Page margin

Post by Nanu Nanu »

I'm having the same issue on page 6 of the same topic 16 mentioned. I'm using Chrome though.
Prema wrote:The second match starts, a new beginning,
Nanu and Prema, Sui and Ninja,
versus those same old hoes grinning.

User avatar
ppotter
Match Winner
Posts: 450
Joined: Sun Sep 28, 2008 12:45 am

Re: Page margin

Post by ppotter »

I had it on that page on my phone too, no others.

*16
Core Dumper
Posts: 173
Joined: Wed Jun 02, 2010 12:59 pm

Re: Page margin

Post by *16 »

I already mentioned in the first post that I'm using 8.0.3, which is the latest stable version available. I can also reproduce the same problem on Chrome. Developper Tools is not giving any errors.

But as I said, it doesn't really matter. Was just mentioning it.

I've seen it on a few other pages as well, can't remember which ones tho.
Image

Durf
Match Winner
Posts: 426
Joined: Mon Jul 30, 2012 10:35 pm

Re: Page margin

Post by Durf »

So nothing is wrong with the site, or your browser.
Though I think perhaps you got the page numbers mixed up, because I got the opposite effect at a lower resolution. (page 1 <=> page 6)

The problem is actually a very ordinary occurrence: non-word boundary characters are being used too much consecutively.
The example is in this post where Z-Man uses multiple = ("is equal to" symbols) in a row, and that defines a minimum page width (your browser isn't going to break up a "word" that long).

Not sure how you'd want this fixed...use a larger resolution? Perhaps a PSA to educate people on the use of excessively streams of the same character and how that can affect scrolling on devices with smaller resolutions.

User avatar
Jonathan
A Brave Victim
Posts: 3392
Joined: Thu Feb 03, 2005 12:50 am
Location: Not really lurking anymore

Re: Page margin

Post by Jonathan »

Don't put everything in tables, I guess.
Attachments
tables are evil.png
ˌɑrməˈɡɛˌtrɑn

User avatar
aP|Nelg
Match Winner
Posts: 558
Joined: Wed Oct 22, 2014 10:22 pm
Contact:

Re: Page margin

Post by aP|Nelg »

looks fine on chrome for me:
Attachments
screenshot19.png

User avatar
Tank Program
Forum & Project Admin, PhD
Posts: 6704
Joined: Thu Dec 18, 2003 7:03 pm

Re: Page margin

Post by Tank Program »

It is probably a bit late to shift away from a table based layout. Something to keep in mind for future themes though.
Image

User avatar
Jonathan
A Brave Victim
Posts: 3392
Joined: Thu Feb 03, 2005 12:50 am
Location: Not really lurking anymore

Re: Page margin

Post by Jonathan »

aP|Nelg wrote:looks fine on chrome for me:
That's because your window is at least as wide as the widest post.

Tank: Yeah, must be a pain to do that now for relatively little gain. Tables should be afraid, though. Go chairs! :)
ˌɑrməˈɡɛˌtrɑn

Durf
Match Winner
Posts: 426
Joined: Mon Jul 30, 2012 10:35 pm

Re: Page margin

Post by Durf »

Tables or not, it doesn't make a difference. In fact, one might prefer the effect tables cause with this problem.

Here's a fiddle with a TABLE, to show how a really long word effects horizontal scrolling with tables.

Here's a fiddle with a DIV (alternate used in phpBB styles), to show the horizontal scrolling with DIVs.

Visit the fiddle and adjust the width of the "Result" section (by increasing/decreasing the left side's width) to mimic various resolutions.

As you can see, when a word surpasses the screen width, it doesn't matter if it's a table or not; browsers just don't want to break up words.
In fact, the natural reaction for a table is to extend the table width so it fits around the content. But a DIV ignores that and allows the content to leak outside (overflow) the original DIV's width.

It is just a resolution issue (can't people just scroll to the side anyway? Big deal) - we can all make an effort not to make such long "words" to avoid this problem for our users with lower resolutions.
Tables don't matter for this problem.

If you'd like help getting a new style, I'm willing to help out with that.

User avatar
Jonathan
A Brave Victim
Posts: 3392
Joined: Thu Feb 03, 2005 12:50 am
Location: Not really lurking anymore

Re: Page margin

Post by Jonathan »

Stop being ridiculous. It's much less of a pain to just let overflow happen without affecting anything else and you know it.
ˌɑrməˈɡɛˌtrɑn

Durf
Match Winner
Posts: 426
Joined: Mon Jul 30, 2012 10:35 pm

Re: Page margin

Post by Durf »

Jonathan wrote:Stop being ridiculous. It's much less of a pain to just let overflow happen without affecting anything else and you know it.
What? Can you explain what you mean?

All I was showing was how "tables" are not part of the problem (really have nothing to do with the problem).
And a new style based on DIVs wouldn't really change that either - in fact, CSS would be applied to them (prosilver based styles) that would probably make them act like a table anyway (so even more of a worthless pursuit).

How exactly was I being ridiculous? :?

Post Reply