Nasser
Nasser

Reputation: 13131

why is MathJax adding a frame around text in HTML which has no math indicators around it?

This is an HTML generated by htlatex. When I use Mathjax, the HTML, which has no math in it, shows completely different. MathJax adds a frame around the text in the body of the HTML.

When I remove MathJax, the frame is gone.

Here is the HTML

<!DOCTYPE html> 
<html> 
<head> <title></title> 
<meta charset="UTF-8" /> 

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

</head>

<body>

&#x00A0;&#x00A0;&#x00A0;&#x00A0;&#x00A0;this&#x00A0;is&#x00A0;verbatim

&#x00A0;<br />&#x00A0;&#x00A0;&#x00A0;&#x00A0;\begin{foo}
&#x00A0;<br />&#x00A0;&#x00A0;&#x00A0;&#x00A0;&#x00A0;&#x00A0;&#x00A0;&#x00A0;&#x00A0;test
&#x00A0;<br />&#x00A0;&#x00A0;&#x00A0;&#x00A0;\end{foo}
&#x00A0;<br />&#x00A0;&#x00A0;

</body> 
</html>

Here is the screen output on firefox:

enter image description here

Now when I remove MathJax from the HTML head, this is the output:

<!DOCTYPE html> 
<html> 
<head> <title></title> 
<meta charset="UTF-8" /> 

</head>

<body>

&#x00A0;&#x00A0;&#x00A0;&#x00A0;&#x00A0;this&#x00A0;is&#x00A0;verbatim

&#x00A0;<br />&#x00A0;&#x00A0;&#x00A0;&#x00A0;\begin{foo}
&#x00A0;<br />&#x00A0;&#x00A0;&#x00A0;&#x00A0;&#x00A0;&#x00A0;&#x00A0;&#x00A0;&#x00A0;test
&#x00A0;<br />&#x00A0;&#x00A0;&#x00A0;&#x00A0;\end{foo}
&#x00A0;<br />&#x00A0;&#x00A0;

</body> 
</html>

and the HTML looks like

enter image description here

Fyi, the original latex file foo.tex used to generate the above HTML is

\documentclass[]{article}
\begin{document}

  \begin{verbatim}
     this is verbatim
    \begin{foo}    
         test  
    \end{foo}
  \end{verbatim}
\end{document}

Was compiled using the command

htlatex foo.tex "t.cfg"

where t.cfg is

\Preamble{}


\Configure{VERSION}{}
\Configure{DOCTYPE}{\HCode{<!DOCTYPE html>\Hnewline}}

\Configure{HTML}{\HCode{<html>\Hnewline}}{\HCode{\Hnewline</html>}}
\Configure{@HEAD}{}
\Configure{@HEAD}{\HCode{<meta charset="UTF-8" />\Hnewline}}
\Configure{@HEAD}{\HCode{<link rel="stylesheet" type="text/css" href="\expandafter\csname aa:CssFile\endcsname" />\Hnewline}}
\Configure{@HEAD}{\HCode{<script type="text/javascript"\Hnewline 
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"\Hnewline
></script>\Hnewline}}
\Configure{@HEAD}{\HCode{<style type="text/css">\Hnewline
  .MathJax_MathML {text-indent: 0;}\Hnewline
</style>\Hnewline}
}    

\begin{document}
\EndPreamble

question is why is loading Mathjax causes a frame put around the text shown and center it in middle of the page?

Upvotes: 2

Views: 751

Answers (2)

David Carlisle
David Carlisle

Reputation: 5652

The issue is unrelated to the spacing, you get the same frame from

<!DOCTYPE html> 
<html> 
<head> <title></title> 
<meta charset="UTF-8" /> 

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

</head>

<body>

\begin{foo}
test
\end{foo}

</body> 
</html>

You can configure mathjax not to look at certain elements or just wrap the text in pre which mathjax ignores by default.

<!DOCTYPE html> 
<html> 
<head> <title></title> 
<meta charset="UTF-8" /> 

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

</head>

<body>

<pre>
\begin{foo}
test
\end{foo}
</pre>

</body> 
</html>

Upvotes: 1

I also realise I've not actually answered your question, which is pretty lousy of me: MathJax will show plain text in a framed box if there's LaTeX code that it doesn't know how to convert: MathJax will not load all possible packages by default, so for a fair number of them you will need to set up the MathJax config object first, see http://docs.mathjax.org/en/latest/tex.html for which ones you can load.

For instance, http://jsfiddle.net/HPDDn/1/ shows two MathJax blocks, one that it knows how to convert, the other framed as plain text because it has no idea what verbatim is.

Upvotes: 3

Related Questions