My browser, Firefox 3.6, seems to display the Mathml equations in the W3C test suite just fine. But if I copy the code into my webpage, like from here, all Firefox produces is something like x y x y instead of how it correctly rendered the W3C page. What am I missing here>
EDIT: I just tried it in Chrome and Chrome failed the test itself by rendering it as x y x y. Needless to say, it rendered the math in my own webpage the same.
EDIT 2: I tried it on a new html document. Doesn't work:
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
</head>
<body>
<math display="inline" xmlns="http://www.w3.org/1998/Math/MathML" mode="display">
<mfrac>
<mi>x</mi>
<mi>y</mi>
</mfrac>
</math>
<math display="block" xmlns="http://www.w3.org/1998/Math/MathML" mode="inline">
<mfrac>
<mi>x</mi>
<mi>y</mi>
</mfrac>
</math>
</body>
</html>
I swear the W3C equations render just fine though...
Including
<script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=MML_HTMLorMML"></script>
and then using
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mroot>
<mrow>
<mi>x</mi>
</mrow>
<mn>4</mn>
</mroot>
</math>
works in Chrome and Firefox
Update:
Since the mathjax cdn is shutting down, change
<script type="text/javascript" async
src="https://cdn.mathjax.org/mathjax/2.7-latest/MathJax.js?...">
</script>
to
<script type="text/javascript" async
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?...">
</script>
as others have said you need to serve as xml for FF3, if you want to use mathml-in-html5 served as text/html you need firefox 4 (or webkit nightlies)
Putting your file in a filename named mml-prb.xhtml works. Note the extension.
You should use xml and serve it as such (i.e. use correct mimetype), which means you have to use xhtml and mathml tags with proper namespaces. Take how W3C serves the example as an example.
Note: HTML5 is NOT xml
Related
Apparently MathJax works with XHTML pages, but I cannot seem to get this to work. Does anyone have a sample file with this working? I have a simple example that works in HTML but not when converted to valid XHTML (validated with Oxygen XML Editor).
OK I did a bit more paring back of my work and have now crafted a basic sample that seems to render correctly via XHTML in Chrome 74. Case closed, and hope this helps someone else.
EDIT: I would note that the file suffix has to be .xhtml not .xml. If the suffix is .xml then the MathJax does not render. It appears the MIME type of the file must be "application/xhtml+xml" in order for MathJax to work.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>MathJax Test</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=MML_CHTML"></script>
</head>
<body>
<p>
Equation below:
<math xmlns="http://www.w3.org/1998/Math/MathML" display="block">
<mi>x</mi> <mo>=</mo>
<mrow>
<mfrac>
<mrow>
<mo>−</mo>
<mi>b</mi>
<mo>±</mo>
<msqrt>
<msup><mi>b</mi><mn>2</mn></msup>
<mo>−</mo>
<mn>4</mn><mi>a</mi><mi>c</mi>
</msqrt>
</mrow>
<mrow> <mn>2</mn><mi>a</mi> </mrow>
</mfrac>
</mrow>
<mtext>.</mtext>
</math>
</p>
</body>
</html>
I am facing issues that Chinese characters are not displayed properly in chrome. Below is a screenshot of whats happening.
I am wondering is there any extensions that is causing this or its because my CSS / fonts are not coded well.
I really want to fix this via my code side. Is it possible?
EDIT: Some of the words show up while some did not.
I did add in the meta charset=UTF-8
EDIT2 : #torazaburo, showing you the code snippet. The problem is that firefox is able to display all the Chinese text!
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<h1>My Website</h1>
<p>Some text...</p>
</body>
have you tried using meta charset
<meta charset="UTF-8">
It enables browsers to understand any language it can be chinese , Urdu , hindi any language which you will write.
I am wondering is there any extensions that is causing this or its because my CSS / fonts are not coded well.
It's unlikely that this has anything to do with an extension. It could be due to a font issue, but that's also relatively unlikely. Probably you have an encoding problem, so:
Make sure your file is saved in UTF-8.
Make sure the file is being served as UTF-8.
Specify the the <meta charset="UTF-8"> tag proposed in another answer.
Make sure you have fonts selected which can display Chinese.
See also the second answer to this question.
[solved - issue was related to web tools provided by ucoz]
Your webpage lacks a doctype.
<!DOCTYPE html> should be the first thing in the HTML.
Then use the HTML validator provided by the W3C to fix up your HTML http://validator.w3.org.
You should invest in a reset stylesheet to normalize the elements across browsers. Try plugging this into your header:
<link rel="stylesheet" type="text/css" href="http://meyerweb.com/eric/tools/css/reset/reset.css">
This is a weird bug that I can't figure out because I have tested it on my PC in IE7 and IE8 on XP and it's working just fine.
But the main navigation is broken in XP on this site:
http://tupelomainstreet.com/play
I've attached screenshots of my client's screen and environment.
If anyone has any black magic for IE, that would be amazing. I'm at a loss.
On http://tupelomainstreet.com/shop/salons-and-spas:
You're loading these JavaScript files from your server:
<script src="js/libs/modernizr-1.6.min.js"></script>
<script src="js/mylibs/fancyzoom.js"></script>
<script src="js/mylibs/slideshow.js"></script>
<script src="js/plugins.js"></script>
<script src="js/script.js"></script>
(for lt IE 7 only) <script src="js/libs/dd_belatedpng.js"></script>
Let's stick with modernizr-1.6.min.js.
If I load that file, I get something which looks distinctly not like a JavaScript file:
<!doctype html>
...
<title>Downtown Tupelo Main Street Association</title>
The fact that a HTML page is being returned is surely the work of mod_rewrite. Without mod_rewrite, I'm sure you'd be getting a nice, easy to debug 404 Not Found error instead.
I believe the easiest way to fix this is to prepend the script includes with /:
<script src="/js/libs/modernizr-1.6.min.js"></script>
This will load the correct file.
It's a very safe bet that this problem is what's killing your menu in Internet Explorer.
I had this code in my website
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"/>
<script type='text/javascript' src='/lib/player/swfobject.js'></script>
swfobject was not working (not loaded).
After altering the code to:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
<script type='text/javascript' src='/lib/player/swfobject.js'></script>
It worked fine.
The document was parsed as HTML5.
I think it’s funny. Okay, granted a tag that is closed and a self-closing tag are not the same. So I would understand if jQuery couldn’t load (although I find it ridiciulous).
But what I do not understand is that jQuery loads but the following, correctly written tag, doesn’t?
In HTML, there are tags which are always self-closed. For example, <hr>Some content here</hr> does not make any sense. In the same way, there are tags which cannot be self-closed. <script> tag is one of them.
I am not sure about the reason of no self-closed <script> tags, but the reason might come from the fact that the tag was intended to always contain code inside. Again, I'm not sure.
Because it gets parsed as:
Line 1: Start tag for script
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"/>
Line 2: JavaScript (really broken JavaScript!) to execute if the external script mentioned on line 1 fails to load
<script type='text/javascript' src='/lib/player/swfobject.js'>
Line 3: End tag for script started on line 1
</script>
Okay, granted a tag that is closed and a self closing tag are not the same.
They are the same (if there is no content), but only in XML documents. An XHTML document served as application/xhtml+xml is an XML document. In an HTML document, thanks to a legacy of improper implementations by browsers, a self-closing tag is just a start tag (and so is only OK when the end tag is forbidden).
David Dorward's answer explains this from one angle, but there is a deeper reason why you can't do this:
A slash at the end of a tag does not make it self-closing in HTML
The self-closing syntax is part of XML. In a normal HTML document, it has no meaning.
#Joe Hopfgartner: Did you alter the code to test if
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js" />
<script type="text/javascript" src="/lib/player/swfobject.js" />
works? ;-)
Update:
Run the code and the <p> element gets hidden, so...looks like it works?
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>questions/4531772</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"/>
<script type="text/javascript" src="4531772.js"/>
</head>
<body>
<p class="test">Testing...</p>
</body>
</html>
JavaScript (4531772.js)
$(document).ready(function() {
$('.test').hide();
});