Movement on Tag 08UP

[aisejohan]

Weird behavior where you can slide the text of the remark to the left.

[pbelmans]

The commutative diagram causes this. MathJax seems to reserve quite a bit of extra space that's not needed, but still causes the parent element to become wide. That's only speculation though.

It's a bit hard to really figure out what's going on, but I'll do my best.

[pbelmans]

I've now made the equations scroll, but not the surrounding text. This still feels intuitive to a user (at least when that user is me who is pretending to be a normal user).

Closing for now, but I'm interested in figuring out how to really make sure that no redundant whitespace is created.

[pbelmans]

Actually, let's keep this open, so I don't forget about it.

[pbelmans]

I've been looking into this, without too much success. The scrollWidth is too large, and I don't see a good way of changing it.

[pbelmans]

For the record, disabling the preview isn't helping.

[pbelmans]

Part of the problem is that only WebKit has ::-webkit-scrollbar. Now we have overflow: -moz-scrollbars-none; but that effectively makes the overflow in Firefox behave like overflow: hidden. Which is not what we want. So there are two problems:

• too big a width (in all browsers)
• no good scrollbar hide / show depending on width (in all browsers except WebKit-based)

[PatrickMassot]

Do you write this -web-kit stuff by hand? Getting these stuff right is a full-time job, you most probably want professionals handling this for you. Do you know about stuff like postcss?

[PatrickMassot]

If you start using lots of custom CSS on top of bootstrap, you'll also probably want to invest in sass. Note that even my css for plasTeX HTML5 renderer are built using Sass and postcss

[pbelmans]

There is a single environment (div.equation) that is too wide when being handled by XyJax. I'm not writing big sets of browser-specific code in a complicated design for this issue, and in any case, the main problem here seems to be XyJax-related, not CSS-related. The use of --webkit-scrollbar here might act as a red herring here, like I said, there are 2 problems, one of which is probably unrelated to CSS and vendor-specific prefixes etc. But I need to do more testing to figure out what's really going on.

That being said, I agree that using Sass will be useful when the time comes to make the code more generic and more customisable. It'll be a good occasion for a cleanup in a few weeks' time.