Add local scroll bar for long equations

support
1

Hi everyone!
I have some long equations in my posts that are getting cut off on the right side. Is there a way to add a local scrollbar to my MathJax equations? I would really appreciate any help with this :smile:
image

2

Add a CSS rule for the mjx-container element, including something like:

overflow-x: auto;
3

Hi @jmooring, thanks for the quick reply! Can you please elaborate on where to add the css rule? I am not familiar with html and css stuff :sweat_smile:

4

That’s going to be a problem. If you are using a theme, try contacting the theme author.

6

I am using the standard Academic CV theme. Is there a tutorial in the official documentation somewhere to explain this step?

7

You are more likely to receive an accurate and timely response from the Academic/Wowchemy/Hugo Blox team:
https://github.com/HugoBlox/hugo-blox-builder/discussions

They also have an active Discord channel:
https://discord.com/invite/z8wNYzb

8

Thank you! I will try there :slight_smile:

9

OK I got the css part. I just had to create the file assets/scss/custom.scss and add all the css rules to it.

But the following did not work for me:
.mjx-container{
overflow-x: auto;
}

I tried the following which made it just go crazy…
*{
overflow-x: auto;
}

image
image1585×839 30.8 KB

I want it to add only a side scroll, that too only if it is necessary. Any suggestions?

10

I’m not sure what to tell you. It works fine for me when I’m rendering LaTeX using the MathJax engine.

Are you sure you’re using MathJax? View source and look at what’s wrapping your elements.

11

No worries, I got it. I used the following:

.MathJax, .MathJax_Display {
overflow-x: auto !important;
overflow-y: hidden !important;
}

Thanks for helping me out!! :smile: