Skip to content

Commit

Permalink
add font-stretch
Browse files Browse the repository at this point in the history
  • Loading branch information
o-t-w authored and hteumeuleu committed Dec 16, 2023
1 parent 81361a8 commit a45d77d
Show file tree
Hide file tree
Showing 2 changed files with 145 additions and 0 deletions.
119 changes: 119 additions & 0 deletions _features/css-font-stretch.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,119 @@
---
title: "font-stretch"
description: "Selecting different font widths (e.g. condensed, expanded)"
category: css
keywords: font
last_test_date: "2023-09-23"
test_url: "/tests/css-font-stretch.html"
test_results_url: ""
stats: {
apple-mail: {
macos: {
"16": "y"
},
ios: {
"16": "y"
}
},
gmail: {
desktop-webmail: {
"2023-09": "y #1"
},
ios: {
"2023-09": "y"
},
android: {
"2023-09": "u"
},
mobile-webmail: {
"2023-09": "y #1"
}
},
outlook: {
windows: {
"2007": "u",
"2010": "u",
"2013": "u",
"2016": "u",
"2019": "u"
},
macos: {
"2023-09": "y"
},
outlook-com: {
"2023-09": "y #1"
},
ios: {
"2023-09": "y"
},
android: {
"4.2101.1": "u"
}
},
yahoo: {
desktop-webmail: {
"2023-09": "n"
},
ios: {
"2023-09": "n"
},
android: {
"2019-09": "u"
}
},
aol: {
desktop-webmail: {
"2023-09": "n"
},
ios: {
"2023-09": "n"
},
},
protonmail: {
desktop-webmail: {
"2023-09":"y #1"
},
ios: {
"2023-09":"y"
},
android: {
"2022-12":"u"
}
},
thunderbird: {
macos: {
"2023-09": "y"
}
},
samsung-email: {
android: {
"6.1.31.2": "u"
}
},
mail-ru: {
desktop-webmail: {
"2022-08":"u"
}
},
free-fr: {
desktop-webmail: {
"2022-08": "u"
}
},
gmx: {
desktop-webmail: {
"2022-08": "u"
}
},
t-online-de: {
desktop-webmail: {
"2022-08": "u"
}
},
}
notes_by_num: {
"1": "Partial. Depends on the browser. There is currently a bug in Chrome/Edge where font-stretch does not work for variable fonts."
}
links: {
}
---
26 changes: 26 additions & 0 deletions tests/css-font-stretch.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes">
<meta name="format-detection" content="telephone=no, date=no, address=no, email=no, url=no">
<meta name="x-apple-disable-message-reformatting">
<title>font-stretch</title>

</head>
<body class="body">
<div class="container" lang="en" dir="ltr" style="font-size:16px; max-width: 600px;">

<p>Test for system-ui (should have multiple widths on Apple devices and forthcoming versions of Android...)</p>
<h2 style="font-family: system-ui; font-stretch: 50%;">system-ui condensed</h2>
<h2 style="font-family: system-ui; font-stretch: 150%;">system-ui expanded</h2>

<p>Test for Bahnschrift (should have multiple widths on Windows - although the difference is subtle)</p>
<h2 style="font-family: 'Bahnschrift'; font-stretch: 50%;">Bahnschrift condensed</h2>
<h2 style="font-family: 'Bahnschrift'; font-stretch: 200%;">Bahnschrift expanded</h2>


</div>
</body>
</html>

0 comments on commit a45d77d

Please sign in to comment.