MathJax 3 and \overrightarrow - mathjax

How to fix \overrightarrow in MathJax 3?
On Firefox
and on Chrome
it looks very ugly (the arrow is not a straight line).

Related

Is it possible to show a web font's defined missing glyph U+0000 in a web browser? A.k.a. the ".notdef" or "not found" glyph

I'm working on some web font subsets and want to see what my font's notdef / U+0000 character looks like on-screen, in a browser.
I've tried printing known-missing glyphs like è, which every browser (old and new, Mac and Win) shows properly but in a some kind of fallback font.
I've tried printing  but it doesn't show what is defined in my actual custom font. IE11 shows the White Square U+25A1, while every other browser shows the Replacement Character U+FFFD.
Steps to solve:
CSS? Remove all other css font-family fallbacks except my custom font. Result: Does not work.
CSS? Specify unicode-range: U+0000;, does not change anything.
Browser? Can confirm browser behavior is the reason I can't see my fallback glyph. Browser shows serif as default for undefined glyphs.
Question remains: How can I show my font's specific U+0000 / notdef in the browser? Maybe it can't be done? May have to create an extra font and fill it with notdef glyphs?
And why do browsers show  as serif instead of the custom font's definition?

The only way I've found to force-show a font's built-in .notdef glyph is to go to unicode-table.com, click COPY and paste the character into my UTF-8 html.
(||) each print the font's built-in Replacement Character used to replace an unknown, unrecognized, or unrepresentable character. This even applies to fonts as basic as Arial, Times New Roman and Courier + Courier New.
EDIT: Firefox 52-94 will always show it's own built-in .notdef character.

unicode box-drawing does not render correctly in browsers

I recently discovered this historical document, which purports to act as a test of UTF-8 encoding for whatever application displays it.
When I paste it into my terminal (iterm2), it loads the box drawings at the end beautifully (except for a couple at bottom right):
But in both Chrome and Firefox, they are crooked and clearly wrong:
It seems the difference has to do with the width of the rendered character: for example "╲" displays in my terminal as wide as other characters such as "a", but in the browser it displays wider.
Is this a deliberate choice, and if so what inspired it? If not, where is the right place to file a bug?
EDIT
Thanks to Tom Blodget's answer, I am now aware that fonts are an important consideration. I'll clarify:
In my screenshots above, Firefox and Chrome are using Courier as the monospace font, while the terminal is using Monaco. In both contexts, the font seems to apply as much to the box-drawing characters as to the ASCII ones: when I change the font, the appearance of the drawings changes as well as that of the surrounding text.
When I switch the terminal to either Courier or Courier New, it shows the box drawings equally well -- in some ways better!
When I switch either browser to Monaco, it still shows the box drawings wrong, again from characters apparently displaying at a wider-than-monospace width.
So it still seems like the browsers are doing something wrong.

When I go to dev tools, I see the entire test is one pre element. Several fonts are being used on my system. Everything looks okay except the hatch pattern on the right.
If I hack out all of the other text, the only font used is Consolas and it looks okay. I think it's down to which fonts you have, how the browser prioritizes them, especially when it has to use more than one, and (conjecture) two monospaced fonts need not have the same width.
A terminal is likely to be less adept at using multiple fonts, instead, using one fixed one or selecting one "best" match for the required characters.
[Google Chrome 72.0.3626.96 on Windows 10.]

This is likely the same as https://bugs.debian.org/981577
If you have any old fonts installed that don't cover the unicode BOX DRAWING range, it's likely that your browser is stitching them together. While each font itself might be monospace (each glyph is the same width within the font), the combination of fonts might not be monospace (because glyph width differs between fonts), which is why the alignment fails.
I found on my system that uninstalling the legacy Bitstream Vera font resolved the issue. (Bitstream Vera has been superseded by DejaVu Sans)

MathML in Firefox OS

I am doing a small project where I write mathematical texts in HTML using MathML. When I test it on Firefox, the results are as expected, everything is displayed as expected.
However, in Firefox OS 2.0 (that I would expect to work in the same way), there are problems with characters like the real set (ℝ) or the star (⋆), which are displayed as gray blocks.
Is this a problem with Firefox OS or there are specific tags to be notified on the HTML that allow these symbols to be correctly interpreted? Or is there another way to represent this symbols?

What you are seen is the replacement character, often a black diamond with a white question mark, �, that in Firefox OS is a gray block.
Why you seen the replacement character only in Firefox OS? Because only Firefox OS hasn't the character that you need. As Jason Weathersby already mention, you should check https://bugzilla.mozilla.org/show_bug.cgi?id=775060.
Last year I worked with Firefox OS and MathML for Google Summer of Code, https://r-gaia-cs.github.io/gsoc2014/, and had to build my own image of Firefox OS to have properly fonts available. If you want to try build your own image of Firefox OS with fonts that support MathML, read http://ftb.rgaiacs.com/2015/03/16/math_at_firefox_os.html.
Gays blocks normally means that the font that you are using doesn't has the character.

Arrows in SVG aren't rotated when rendered by browsers

I created an SVG file, and in inkscape it looks like this:
But when I render it by a browser, the arrows get screwed up:
This (above) is the actual svg (link), and in case it renders correctly in your browser, here is how I see it (this time it's a screenshot in png):
It's the same in the latest Firefox and Chrome.
This file was created in inkscape 0.48 on Windows, and when I re-open it in inkscape, it renders correctly. Is there a way to make the browser rotate the arrows?

There are bug reports of this for Chrome, Firefox, Inkscape, and Wikimedia. It turns out that some renderers get the arrow direction wrong when just one handle, the one at the beginning of the curve, has zero length. Currently, Firefox, Inkscape, and LibreOffice Write get it right, while Chrome gets it wrong.
To create an example of such a line, draw a line in Inkscape, then add a curved midpoint. Inkscape then makes both segments Bezier curves, but the end segments have zero length handles. If you then delete the midpoint, Inkscape will try to match the curve, and will create non-zero length handles for the endpoints.
Reported as bug in Firefox in 2015, and fixed
Reported as bug in Chrome in 2015, and not fixed
Reported as bug in Inkscape in 2006, blamed on user and closed as "out of date" in 2009
Reported as bug in Wikimedia in 2015, by me
Discussion of ambiguity in SVG spec

A fix that I have noticed in Inkscape is to first select the "edit paths by nodes" option, and select each endpoint and select the option to "make the selected nodes smooth" from the path editing toolbar.

I found the solution:
The problem was that for these lines Bezier curves were used, and even though the lines were straight, it caused the problem. Once I replaced the curves with "diagram connectors", the problem disappeared.

You're using degenerate bezier curves which display as straight lines. Neither Chrome nor Firefox prior to version 38 cope with these when determining marker angles.
This has been fixed in Firefox 38 by bug 1129854. I think there's an equivalent Chrome bug too.

Odd horizontal line in SVG

I'm making a polygon clipper demo program and found a problem, that cannot solve.
All other browsers shows the example svg as expected, but newest Opera 12.11 (in Windows 7 and Mac OS X 10.6) shows some odd horizontal line.
Opera 12.11 result:
Other browser's (IE9, Firefox, Safari, Chrome) result:
I expect this is a bug in Opera because all other browsers shows the right result, but not sure, because when I eg. remove some Z in path command, also Opera shows the right result.
What could be wrong in my SVG or is it a bug in Opera?
Problematic path:
<path style="fill:#80ff9C; fill-opacity:0.5; stroke:#003300; stroke-opacity:1.00; stroke-width:0.80;" id="p3" d="M167.12,227.93L164.78,225.58L164.78,201.75L163.53,203L142.92,203L140.9,200.97L138.87,203L118.45,203L116.11,200.65L116.11,200.43L114.14,201.09L113.87,201.16L106.39,202.53L106.15,202.56L96.48,203.17L96.22,203.17L88.33,202.67L88.05,202.63L81.88,201.36L81.55,201.26L76.74,199.37L76.36,199.18L72.51,196.63L72.16,196.34L69.06,193.09L68.8,192.73L66.34,188.65L66.17,188.3L64.3,183.01L64.21,182.69L62.96,175.77L62.94,175.53L62.45,166.59L62.44,166.32L62.83,161.46L56.41,160.67L56.12,160.6L52.27,159.53L52.27,187.6L49.92,189.95L26.52,189.95L24.18,187.6L24.18,83.41L26.52,81.07L49.92,81.07L52.26,83.4L52.26,83.68L52.45,83.58L52.75,83.46L58.61,81.53L58.96,81.45L64.69,80.67L65.08,80.65L72.44,81.09L72.72,81.13L79.06,82.42L79.39,82.52L83.26,84.05L83.69,84.29L87.35,86.93L87.68,87.22L91.13,91.09L91.33,91.38L94.37,96.28L94.54,96.62L96.5,101.85L96.59,102.16L96.73,102.82L97.48,100.58L97.61,100.27L100.23,95.33L100.44,95.02L103.76,90.87L104.02,90.6L107.95,87.24L108.26,87.02L113.01,84.32L113.34,84.16L118.9,82.22L119.21,82.14L125.69,80.98L125.93,80.96L131.95,80.65L132.32,80.65L140.3,81.11L140.56,81.14L147.02,82.4L147.33,82.49L152.58,84.42L152.92,84.58L157.36,87.23L157.67,87.46L161.42,90.82L161.69,91.13L164.68,95.19L164.88,95.54L167.12,100.34L167.24,100.65L168.03,103.46L168.03,54.67L170.37,52.33L193.56,52.33L195.91,54.67L195.91,81.07L217.13,81.07L219.12,82.36L235.15,118.59L249.15,82.45L251.21,81.06L267.29,81.15L269.65,84.63L267.35,90.56L268.9,88.56L269.17,88.27L272.65,85.24L273.05,84.97L276.65,83.1L277.08,82.93L282.96,81.43L283.26,81.38L290.26,80.67L290.56,80.66L295.53,80.9L295.87,80.96L301.02,82.12L301.34,82.22L305.26,83.84L305.26,83.4L307.6,81.06L331,81.06L333.35,83.41L333.32,106.07L335.16,100.58L335.29,100.27L337.92,95.33L338.12,95.03L341.43,90.88L341.71,90.6L345.65,87.24L345.95,87.03L350.69,84.32L351.02,84.17L356.58,82.22L356.89,82.14L363.36,80.98L363.61,80.96L369.63,80.65L370.01,80.65L377.98,81.11L378.24,81.14L384.71,82.4L385.02,82.49L390.27,84.42L390.6,84.57L395.04,87.22L395.37,87.45L399.12,90.83L399.38,91.13L402.37,95.19L402.57,95.54L404.81,100.34L404.93,100.65L405.38,102.26L405.38,83.41L407.72,81.07L431.34,81.07L433.68,83.4L433.68,83.92L438.94,82.01L439.27,81.92L445.06,80.88L445.37,80.85L452.26,80.69L452.57,80.71L458.4,81.45L458.76,81.53L463.42,83.03L463.82,83.22L467.58,85.44L467.99,85.75L471.27,89.06L471.55,89.41L473.86,93.1L474.07,93.55L475.38,97.53L475.47,97.96L475.81,101.25L475.82,101.45L475.82,158.65L473.47,161L455.03,161L452.69,158.66L452.58,103.42L452.18,102.16L451.48,101.27L450.13,100.42L447.35,99.61L443.1,99.28L439.59,100.03L437.44,101.06L435.97,102.39L433.88,105.3L433.69,105.76L433.69,133.06L435.2,133.06L437.55,135.41L437.42,204.06L437.38,204.48L436.39,209.01L436.24,209.46L434.39,213.27L434.11,213.69L431.39,216.92L431.05,217.24L427.42,219.9L427.06,220.11L422.33,222.23L422,222.34L416.02,223.84L415.74,223.89L408.17,224.68L407.94,224.69L398.86,224.52L398.63,224.51L390.95,223.53L390.68,223.47L382.84,221.31L382.48,221.17L379.33,219.61L378.17,217.99L376.45,204.99L380.33,202.19L387.08,205.47L392.85,207.48L398.67,208.52L401.88,208.75L406.92,208.37L409.73,207.59L411.2,206.7L411.81,205.95L412.16,204.84L412.18,202L406.35,203.16L406.04,203.21L399.45,203.51L399.12,203.49L392.54,202.71L392.22,202.64L386.95,201.09L386.52,200.91L383.24,199.05L382.81,198.73L379.7,195.66L379.42,195.32L376.61,190.96L376.43,190.64L375.24,187.75L375.24,200.65L372.89,203L356.55,203L354.21,200.66L354.13,159.59L351.66,158.84L351.33,158.71L346.46,156.26L346.13,156.06L342.02,152.9L341.73,152.62L341.2,152.01L339.97,153.37L339.06,154.95L338.95,200.66L336.61,203L315.82,203L314.06,201.23L312.29,203L291.67,203L289.33,200.65L289.33,187.37L287.34,191.69L287.16,192.02L284.34,196.01L284.05,196.34L280.91,199.18L280.46,199.49L276.95,201.25L276.58,201.38L271.17,202.84L270.84,202.9L264.39,203.53L264.05,203.54L257.14,203.02L256.83,202.97L252.4,201.93L252.4,225.58L250.05,227.93L229.43,227.93L227.09,225.58L227.09,187.22L225.03,191.69L224.85,192.01L222.04,196.01L221.73,196.34L218.59,199.17L218.15,199.48L214.66,201.24L214.28,201.38L208.87,202.84L208.54,202.9L202.08,203.53L201.74,203.54L194.84,203.02L194.54,202.98L190.09,201.94L190.09,225.58L187.74,227.93Z
M197.78,187.5L200.78,187.08L202.89,186.23L204.29,185.11L205.42,183.44L205.87,182.24L205.56,182.06L199.49,170.19L201.9,166.35L208.29,166.49L207.83,159.77L206.88,155.37L205.71,152.86L204.43,151.38L202.73,150.31L200.12,149.55L196.5,149.28L195.91,149.42L195.91,158.65L193.56,161L190.1,161L190.13,185.7L191.31,186.36L194.26,187.2Z
M260.09,187.5L263.09,187.08L265.2,186.23L266.6,185.11L267.74,183.43L268.52,181.3L266.75,180.35L265.65,178.75L263.75,164.25L267.66,161.46L270.35,162.79L270.15,159.77L269.19,155.37L268.59,154.07L266.01,150.91L265.05,150.31L262.43,149.55L258.81,149.28L255.92,149.95L253.38,151.25L252.39,152.03L252.44,185.7L253.62,186.36L256.57,187.2Z
M405.83,187.49L409.74,186.84L412.25,185.76L412.25,161L407.72,161L405.38,158.65L405.38,149.33L404.68,149.3L401.46,149.83L399.56,150.66L396.77,153.62L396.57,153.79L396.4,154.04L395.29,157.12L394.34,162.91L394.05,170.1L394.62,176.48L395.76,181.05L397.11,184.03L398.39,185.5L400.11,186.58L402.55,187.31Z
M98.91,186.95L104.73,186.33L110.5,184.76L114.04,183.1L115.91,181.35L116.11,181.45L116.11,159.49L113.97,158.84L113.64,158.71L108.76,156.26L108.45,156.06L104.34,152.9L104.05,152.62L101.14,149.24L98.46,149.07L95.15,149.49L92.97,150.33L91.58,151.43L90.57,152.94L89.18,156.73L88.31,161.67L88.16,168.46L88.8,175.96L90,181.31L91.09,183.87L92.25,185.3L93.69,186.24L95.82,186.86Z
M61.37,144.33L65.04,143.91L67.63,143L69.49,141.72L70.86,140.06L72.38,136.66L73.77,131.21L74.63,123.89L74.66,116.82L73.94,109.89L72.81,105.46L71.51,102.88L69.94,101.12L68.08,99.95L65.08,99.01L60.82,98.6L57.91,99.06L55,100.23L52.28,102.1L52.37,141.97L53.93,142.85L56.98,143.81Z
M373.19,143.31L373.75,143.23L375.49,142.45L376.68,141.36L377.59,139.78L378.8,135.24L379.65,127.98L379.81,118.04L379.15,109.78L377.96,104.02L377,101.64L375.9,100.29L374.44,99.36L372.16,98.74L369.06,98.65L366.18,99.21L364.22,100.16L362.96,101.34L361.94,103.15L360.64,107.73L359.76,114.54L359.55,120.81L360.41,133.12L360.51,133.62L361.39,133.78L361.8,133.9L365.83,135.57L366.28,135.83L369.42,138.21L369.77,138.56L372.52,141.97L372.78,142.4Z
M289.33,142.66L289.33,135.4L291.67,133.06L293.32,133.06L292.17,132.18L291.75,131.74L289.59,128.68L289.32,128.12L288.23,124.69L288.14,124.09L288.12,120.36L288.2,119.79L289.21,116.36L289.46,115.81L291.52,112.69L291.94,112.24L294.62,110.06L295.19,109.73L298.41,108.54L298.91,108.42L301.8,108.14L302,108.13L302.24,108.13L302.49,108.14L305.26,108.51L305.26,102.2L301.81,100.1L298.17,98.83L296.56,98.6L292.77,99.04L289.99,100L288.01,101.33L286.35,103.26L284.95,106.06L283.76,110.68L282.92,118.05L282.88,124.86L283.64,131.68L284.96,136.7L286.48,139.95L287.9,141.66Z
M252.13,135.13L252.21,135.09L252.5,134.97L257.7,133.34L258.08,133.26L259.63,133.09L259.35,131.43L259.32,131.21L258.81,121.7L258.81,121.48L259.34,112.27L259.37,112.05L259.65,110.44L250.64,133.68Z
M212.81,134.34L195.91,96.07L195.91,133.24L200.92,132.68L201.29,132.68L208.07,133.23L208.38,133.28Z
M141.22,134.33L141.74,129.97L141.22,129.23Z
M141.22,115.01L141.81,114.13L141.47,109.79L140.27,104.02L139.32,101.64L138.22,100.29L136.75,99.36L134.47,98.74L131.37,98.65L128.49,99.21L126.53,100.16L125.25,101.36L124.25,103.14L122.97,107.7L122.89,108.31L138.87,108.31L141.22,110.65Z" fill-rule="nonzero">
</path>
EDIT: When I change "stroke-width" from "0.80" to "0.81" Opera shows the right result, but "0.85" shows the odd horizontal line in other place. Really weird!

Resources