# Problem in rendering with arrow

Screenshots of MathJax text,

CH3-CHOH ->[H2SO4][\Delta] CH2=CH2

• while editing (lower stuffs are cropped):

• after editing, on post page (both stuffs are cropped):

But, the problem isn't with inline, $$\ce{A ->[C][\Delta]B}$$

How to solve this?

(Browser: Firefox 78, OS: Windows)

• This is a browser-specific issue. What you report only happens with the current builds of Chromium-based browsers. On Firefox 78 both $\ce{H2SO4}$ and $\Delta$ are cropped, and MS Edge surprisingly renders MathJax correctly without cropping. Long story short, you might want to attach your screenshot with the description of the system as different users with different browsers will see your equation differently. – andselisk Jul 12 '20 at 10:51
• @andselisk: I'm using firefox 78. Also, when I click the edit button, the H2SO4 is fully visible in reflector below textarea, but when I save edits, then on post page, it is cropped. edit (after you edited): that's good idea. – Rahul Verma Jul 12 '20 at 10:57
• By the way, why do you fixate on Δ? It looks like every character is cropped and there is no relation with the Greek symbols, e.g. consider this MWE: \ce{->[][L]}: $$\ce{->[][L]}$$ – andselisk Jul 12 '20 at 11:01
• Is this really a problem that could be fixed by SE? To me it looks like these are third party shortcomings. Can you also add your MathJax settings please. Maybe this is a render issue. – Martin - マーチン Jul 12 '20 at 14:05
• Just adding this comment for the viewers to see how it renders in their browsers: $$\ce{CH3-CHOH ->[H2SO4][\Delta] CH2=CH2}$$ – Rahul Verma Jul 12 '20 at 14:25
• @Martin - マーチン: 1) I don't know if this is problem with SE or not, but to confirm it, I posted this up. 2) MathJax settings (hearing it for the first time) ? Okay, I'll add that. Btw, if you're on Firefox, you can direct me there. – Rahul Verma Jul 12 '20 at 14:35
• @andselisk, Just checked in Edge v83 (newest with "swirling" icon in blue shades) and in Chrome v83, my comment looks same in all of them (lower stuffs cropped). – Rahul Verma Jul 13 '20 at 7:07
• @RahulVerma I meant the old MS Edge before it became another Chromium. – andselisk Jul 13 '20 at 7:20

It looks like StackExchange has (apparently recently) added CSS that is causing the problem. In their primary.css file is the declaration

.MathJax_SVG_Display, .MathJax_Display {
overflow: auto hidden;
}


that causes anything outside the vertical space of the original expression to be hidden. The sizing of the expressions is subject to slight variation depending on the rounding of the sizes to the screen pixels, antialiasing, and other factors. That is what is causing the clipping for you. This is an error in the StackExchange CSS, so probably needs to be reported to them as a bug (I'm not sure what would have prompted them to add this CSS, but there is probably something they are trying to prevent by using it).

It would be possible to use something like TamperMonkey to override that CSS, if you wanted. Fortunately, however, the CSS only affects HTML-CSS output and SVG output, so if you switch to CommonHTML output, the CSS will not affect that, and the zooming will work properly. (You can switch renderers using the MathJax contextual menu, and selecting Math Settings, then Math Renderer).

This was reported here as well, but for a different reason.

• I'm amazed to see your findings! – Rahul Verma Jul 13 '20 at 17:18