font-inflation-1-ref.html (2983B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>Font Inflation</title> 5 <meta charset="utf-8"/> 6 <style> 7 @font-face { 8 font-family: "dtls-1"; 9 src: url(dtls-1.otf); 10 } 11 p, math { 12 font-family: serif; 13 } 14 </style> 15 </head> 16 <body> 17 18 <p>The text 19 '<math> 20 <mrow id="ref"> 21 <mtext style="font-family: dtls-1">𝔞</mtext> 22 <mtext>+</mtext> 23 </mrow> 24 </math>' 25 should have the same size as inline math 26 '<math> 27 <mrow id="inline"> 28 <mtext style="font-family: dtls-1">𝔞<!-- MATHEMATICAL FRAKTUR SMALL A--></mtext> 29 <mo>+</mo> 30 </mrow> 31 </math>' 32 or math in a table: '<math><mtable><mtr> 33 <mtd> 34 <mrow id="cell"> 35 <mtext style="font-family: dtls-1">𝔞<!-- MATHEMATICAL FRAKTUR SMALL A--></mtext> 36 <mo>+</mo> 37 </mrow> 38 </mtd> 39 </mtr></mtable></math>' 40 (but not necessarily the same size as block-level math 41 <math display="block"> 42 <mrow id="display"> 43 <mtext style="font-family: dtls-1">𝔞<!-- MATHEMATICAL FRAKTUR SMALL A--></mtext> 44 <mo>+</mo> 45 </mrow> 46 </math> 47 because it forms a BFC and hence is its own inflation container.) 48 Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod 49 tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 50 quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 51 consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse 52 cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non 53 proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem 54 ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor 55 incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis 56 nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 57 Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore 58 eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt 59 in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor 60 sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut 61 labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud 62 exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis 63 aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu 64 fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in 65 culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit 66 amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore 67 et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation 68 ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor 69 in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla 70 pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui 71 officia deserunt mollit anim id est laborum.</p> 72 73 </body> 74 </html>