search

mdn / content

The content behind MDN Web Docs
https://developer.mozilla.org
Other
8.99k stars 22.44k forks source link

font-style: oblique <ang> example is not consistent with font-variation-settings: "slnt" <ang> #33439

Open dev-nicolaos opened 2 months ago

dev-nicolaos commented 2 months ago

MDN URL

https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_fonts/Variable_fonts_guide

What specific section or headline is this issue about?

Slant

What information was incorrect, unhelpful, or incomplete?

The live example shows multiple ways to set the slant of the text, one using font-style: oblique <ang> and another using font-variation-settings: "slnt" <ang>. The one using font-style does not change the appearance of the rendered text.

Tested in Firefox 125 and Chromium 124 on both Windows 10 and Fedora 40.

What did you expect to see?

Setting the first example to use font-style: oblique 12deg would visibly change the appearance of the example text the same way setting font-variation-settings: "slnt" 12 does in the next example.

Do you have any supporting links, references, or citations?

This usage of font-style should be supported across all modern browsers: https://caniuse.com/mdn-css_properties_font-style_oblique-angle

Do you have anything more you want to share?

image

MDN metadata

Page report details * Folder: `en-us/web/css/css_fonts/variable_fonts_guide` * MDN URL: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_fonts/Variable_fonts_guide * GitHub URL: https://github.com/mdn/content/blob/main/files/en-us/web/css/css_fonts/variable_fonts_guide/index.md * Last commit: https://github.com/mdn/content/commit/eb9d5b210d017bcce94882253d09fd238ee37dfd * Document last modified: 2023-11-16T14:38:44.000Z
Josh-Cena commented 1 month ago

It seems only oblique 14deg (i.e. the default) is supported. Perhaps this has something to do with the underlying font's configuration.