| <!DOCTYPE html> |
| <html> |
| <head> |
| <meta charset="utf-8"/> |
| <title>Verify dir attribute on various containers</title> |
| <link rel="help" href="https://w3c.github.io/mathml-core/#attributes-common-to-html-and-mathml-elements"> |
| <link rel="help" href="https://w3c.github.io/mathml-core/#css-styling"> |
| <meta name="assert" content="Verify dir attribute on various elements."> |
| <link rel="match" href="direction-overall-002-ref.html"> |
| <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> |
| <style> |
| math { |
| font: 25px/1 Ahem; |
| } |
| </style> |
| </head> |
| |
| </head> |
| <body style="background: white;"> |
| |
| <!-- The visible part of the formulas below should be covered by the |
| black rectangle when dir=rtl --> |
| |
| <div style="position: absolute; top: 5px; left: 5px;"> |
| <!-- msup --> |
| <math dir="rtl"> |
| <msup> |
| <mspace width="20px" height="20px"/> |
| <mspace width="20px" height="20px" mathbackground="red"/> |
| </msup> |
| </math><br/> |
| <!-- msub --> |
| <math dir="rtl"> |
| <msub> |
| <mspace width="20px" height="20px"/> |
| <mspace width="20px" height="20px" mathbackground="orange"/> |
| </msub> |
| </math><br/> |
| <!-- msubsup --> |
| <math dir="rtl"> |
| <msubsup> |
| <mspace width="20px" height="20px"/> |
| <mspace width="20px" height="20px" mathbackground="green"/> |
| <mspace width="20px" height="20px" mathbackground="blue"/> |
| </msubsup> |
| </math><br/> |
| <!-- mmultiscripts --> |
| <math dir="rtl"> |
| <mmultiscripts> |
| <mspace/> |
| <mspace width="20px" height="20px" mathbackground="cyan"/> |
| <mspace width="20px" height="20px" mathbackground="yellow"/> |
| <mprescripts/> |
| <mspace width="20px" height="20px"/> |
| <mspace width="20px" height="20px"/> |
| </mmultiscripts> |
| </math><br/> |
| <!-- munder (mo with movablelimits=true and displaystyle=false) --> |
| <math dir="rtl"> |
| <munder> |
| <mpadded width="20px"> |
| <mphantom> |
| <mo movablelimits="true" displaystyle="false">|</mo> |
| </mphantom> |
| </mpadded> |
| <mspace width="20px" height="20px" mathbackground="magenta"/> |
| </munder> |
| </math><br/> |
| <!-- mover (mo with movablelimits=true and displaystyle=false) --> |
| <math dir="rtl"> |
| <mover> |
| <mpadded width="20px"> |
| <mphantom> |
| <mo movablelimits="true" displaystyle="false">|</mo> |
| </mphantom> |
| </mpadded> |
| <mspace width="20px" height="20px" mathbackground="cyan"/> |
| </mover> |
| </math><br/> |
| <!-- munderover (mo with movablelimits=true and displaystyle=false) --> |
| <math dir="rtl"> |
| <munderover> |
| <mpadded width="20px"> |
| <mphantom> |
| <mo movablelimits="true" displaystyle="false">|</mo> |
| </mphantom> |
| </mpadded> |
| <mspace width="20px" height="20px" mathbackground="yellow"/> |
| <mspace width="20px" height="20px" mathbackground="grey"/> |
| </munderover> |
| </math><br/> |
| <!-- mroot --> |
| <math dir="rtl"> |
| <mstyle mathcolor="white"> |
| <mroot> |
| <mspace width="20px" height="20px" mathbackground="orange"/> |
| <mspace width="20px" height="20px"/> |
| </mroot> |
| </mstyle> |
| </math><br/> |
| <!-- msqrt --> |
| <math dir="rtl"> |
| <mstyle mathcolor="white"> |
| <msqrt> |
| <!-- Here, we assume that (width of radical + width of mspace) |
| is greater than the width of the black rectangle (i.e. |
| width of radical > 30 - 25 = 5px), so the test fails if the |
| radical is placed on the left. --> |
| <mspace width="25px" height="20px" mathbackground="grey"/> |
| </msqrt> |
| </mstyle> |
| </math> |
| </div> |
| |
| <div style="position: absolute; top: 0px; left: 0px;"> |
| <div style="width: 40px; height: 3000px; background: black"></div> |
| </div> |
| |
| </body> |
| </html> |
