font-005.xht (1807B)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <title>CSS Test: Font shorthand set using the values font-style, font-variant, font-size and font-family</title> 5 <link rel="author" title="Microsoft" href="http://www.microsoft.com/" /> 6 <link rel="help" href="http://www.w3.org/TR/CSS21/fonts.html#propdef-font" /> 7 <link rel="help" href="http://www.w3.org/TR/CSS21/fonts.html#font-shorthand" /> 8 <link rel="help" href="http://www.w3.org/TR/css-fonts-3/#font-prop"/> 9 <meta name="assert" content="The 'font' shorthand property accepts and sets font-style, font-variant, font-size and font-family." /> 10 <style type="text/css"> 11 #wrapper 12 { 13 position: relative; 14 } 15 #test 16 { 17 font: italic small-caps 1in serif; 18 line-height: 1em; 19 position: absolute; 20 } 21 #reference 22 { 23 color: orange; 24 font-family: serif; 25 font-size: 1in; 26 height: 1in; 27 left: 0; 28 line-height: 1em; 29 position: absolute; 30 top: 0; 31 width: 1in; 32 } 33 </style> 34 </head> 35 <body> 36 <p>Test passes if the first black "x" is taller and wider than the first orange "x" and shorter than the second orange "X". The second black "X" needs to be the same height as the second orange "X". The black "1" need to also slant to one side.</p> 37 <div id="wrapper"> 38 <div id="reference">xX1</div> 39 <div id="test">xX1</div> 40 </div> 41 </body> 42 </html>