How to change MathJax Style?

Help
1

I want to change the text-align of MathJax from centre to left, so I use CSS snippets as below:

mjx-container[jax="CHTML"][display="true"] {
  display: block;
  text-align: left;
}

But it doesn’t seem to work.

Snipaste_2021-02-14_19-47-52
Snipaste_2021-02-14_19-47-521414×1000 198 KB

How can I apply my code?

2

Two ways, both I just tested successfully.

Option #1 - Use a more precise selector:

div.math mjx-container[jax="CHTML"][display="true"] {
  display: block;
  text-align: left;
}

Option #2 - forcibly override the setting:

mjx-container[jax="CHTML"][display="true"] {
  display: block;
  text-align: left !important;
}

Overriding is the brute force answer but it becomes rather messy when dealing with many styles since it breaks inheritance.

1 Like
3

Thank you very much for your help!

The option #1 doesn’t work for me. I don’t know where goes wrong, maybe influenced by other snippets. :thinking:

And the option #2 solves the problem! :smile:

4

Just out of curiosity, where abouts are you going to edit MathJax?

5

It works! One more question, how can I change the font of the equations, say, to Neo Euler?
The list of fonts supported by MathJax can be found at: MathJax Font Support — MathJax 3.2 documentation

2 Likes