Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Appearance settings

Expand file tree

/

font-variant-numeric-04.html

Copy path
More file actions
More file actions

Latest commit

 

History

History
History
33 lines (33 loc) · 1.2 KB
/

font-variant-numeric-04.html

Copy path

File metadata and controls

33 lines (33 loc) · 1.2 KB
Raw
Copy raw file
Download raw file
Open symbols panel
Edit and raw actions
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<!DOCTYPE html>
<html lang="en">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>CSS Test: font-variant-numeric: proportional-nums; low level equivalence</title>
<link rel="author" title="Chris Lilley" href="chris@w3.org">
<link rel="match" href="font-variant-numeric-04-ref.html">
<link rel="help" href="https://www.w3.org/TR/css-fonts-3/#font-variant-numeric-prop">
<link rel="help" href="https://www.w3.org/TR/css-fonts-3/#font-feature-settings-prop">
<meta name="assert" content="Enables display of proportional numerals (OpenType feature: pnum). ">
<style>
@font-face {
font-family: fwf;
src: url(support/fonts/FontWithFancyFeatures.otf);
}
.test {
font-family: fwf;
font-size: 3em;
line-height: 1.1;
}
.high {
font-variant-numeric: proportional-nums;
}
.low {
font-feature-settings: "lnum" off, "onum" off, "pnum" on, "tnum" off, "frac" off, "afrc" off, "ordn" off, "zero" off;
}
</style>
<body>
<p>Test passes if the three lines below are identical, with two crosses (✗), then one check mark (✓) followed by five crosses (✗). </p>
<section class="test">
<p class="high">PQRSTUVW</p>
<p class="low">PQRSTUVW</p>
<p class="ref">BBABBBBB</p>
</section>
Morty Proxy This is a proxified and sanitized view of the page, visit original site.