Font color problem on specific files

[Simon Lenz]

Hello,

i just installed mathjax on my webpage, but I ran into a font-color problem.

http://i.imgur.com/VBzcQ.png

On the Screenshot above you can see how formulas are currently rendered.

The yellow/green is the color attribute of the parent-element of the equation. So my understanding is, that the whole equation should have this color with standard settings.

But as you can see, every character, expect the normal numbers are rendered in a dark gray. I think, that I don't use this color on my webpage, so this is a bit surprising for me.

Now the question:

What could be the problem? Where can I set the color for the whole equation?

Latex-Code for equation:

Latex-Code for eqn2

        \[ \vec{a} - \vec{b} = \left(\begin{array}{c}-2\\2\end{array}\right) - \left(\begin{array}{c}2\\1\end{array}\right) = \left(\begin{array}{c}-2 - 2\\2 - 1\end{array}\right) = \left(\begin{array}{c}-4\\1\end{array}\right) = \vec{s} \]

and my mathjax implementation:

<script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>

regards,

Simon

[Simon Lenz]

Hello,

it seems, that the problem is an incompatibility with pygments (http://pygments.org/) a python syntax highlighter.

It seems, that pygments and mathjax use the same (css-)classnames for styling issues.

Names like ".mi" and ".mo" for example.

eg: the first "-" in my screenshot viewed as html:

<span class="mo" id="MathJax-Span-37" style="font-family: MathJax_Main; padding-left: 0.222em; ">−</span>

And in my pygments.css file, there is a class defined like this:

.mo { color: #666666 } /* Literal.Number.Oct */

Do you have any tipps for me, how i can avoid something like this?

regards,

Simon

[Davide P. Cervone]

You could perhaps use 

.MathJax .mo { color: inherit }

to override the color for the MathJax output.

Davide

[Simon Lenz]

Thanks for your Tipp!

I've used a little bit different way. I changed every definition of the pygments-css file into:

.highlight .mo { color: #666666 } /* Literal.Number.Oct */

 Since every pygments element is someway a child of a highlight block.

Works great for me.

regards,

Simon

[Davide P. Cervone]

OK, that looks good, too.  Glad you got it to work.

Davide