font-family-name-023

font family names that look like font shorthand

WeasyPrint

Reference (good) by WeasyPrint

Reference (good) by this browser

This browser

Flags
font
Assertion
Font family names that appear similar to font shorthand should match to fonts with those names

Source

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 2 <html>
 3      <head>
 4         <link rel="reference" href="font-family-name-023-ref.xht">
 5         <title>CSS Test: font family names that look like font shorthand</title>
 6         <link rel="author" title="Mozilla" href="http://www.mozilla.com/">
 7         <link rel="help" href="http://www.w3.org/TR/CSS21/fonts.html#propdef-font-family">
 8         <link rel="help" href="http://www.w3.org/TR/CSS21/fonts.html#font-family-prop">
 9         <meta name="flags" content="font">
10         <meta name="assert" content="Font family names that appear similar to font shorthand should match to fonts with those names">
11         <style type="text/css">
12             body { font-size: 36px; }
13             span#verify { font-family: CSSTest Verify; }
14             div.test { font-family: CSSTest Fallback; }
15             p {
16             }
17             p#test1a {
18                 font-family: "small-caps 1in CSSTest FamilyName Funky", CSSTest Fallback;
19             }
20             p#test2 {
21                 font-family: x-large CSSTest FamilyName Funky, CSSTest Fallback;
22             }
23             p#test2a {
24                 font-family: "x-large CSSTest FamilyName Funky", CSSTest Fallback;
25             }
26             p#test3a {
27                 font-family: "12px CSSTest FamilyName Funky", CSSTest Fallback;
28             }
29         </style>
30     </head>
31     <body>
32         <div><a href="http://www.w3.org/Style/CSS/Test/Fonts/">Test fonts</a> must be installed for this test: <span id="verify">FAIL</span></div>
33         <div class="test"><p id="test1a">PaSs</p></div>
34         <div class="test"><p id="test2">PaSs</p></div>
35         <div class="test"><p id="test2a">PaSs</p></div>
36         <div class="test"><p id="test3a">PaSs</p></div>
37     </body>
38 </html>