Mastodon

0 posts0 participants0 posts today

ajaxStardustOpen the conversation about: Since both are valid, and maintained in the W3C rec, we must assume neither is recommended over the other in every use case instance scenario sitch'<a href="https://social.vivaldi.net/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CSS</a> <a href="https://social.vivaldi.net/tags/WebDesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebDesign</a> <a href="https://social.vivaldi.net/tags/WebDevelopment" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebDevelopment</a> <a href="https://social.vivaldi.net/tags/crossplatform" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#crossplatform</a> <a href="https://social.vivaldi.net/tags/deviceneutrality" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#deviceneutrality</a> So... that said... Which method is "better"? They both seem to serve the same functional purpose, in the end. my intended use is primarly and likely only to appear in a .css doc via <link rel="stylesheet">**For the sake of conversation:** Why do we have the ability to be more granular about the identity of the source? See above "@ import" vs "@ font-face"Also, for the sake of ... the same conversation, really: [I personally am confident that <a href="https://social.vivaldi.net/tags/WebDeveloper" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebDeveloper</a> extension exists only after extensive, and continued research]. I feel I could resolve that-- even If i don't know the technical logic leading to one or ther other-- <a href="https://social.lol/@chrispederick" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@chrispederick</a> 's extension, having shown the @-import rendered URL in this-- my most likely to be used enviroment-- it is safe for me to say, i can always trust that at-import is satisfactory, while the more granular aproach of @-font-face seems perhaps overkill for this purpose? <a href="https://social.vivaldi.net/tags/fontface" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#fontface</a> <a href="https://social.vivaldi.net/tags/import" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#import</a> <a href="https://social.vivaldi.net/tags/stylesheet" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#stylesheet</a> <a href="https://social.vivaldi.net/tags/overkill" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#overkill</a>

ajaxStardustCurious observation while pruning some CSS using one of my favorite development tools, "Web Developer" by <a href="https://social.lol/@chrispederick" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@chrispederick</a> <a href="https://social.vivaldi.net/tags/WebDevelopment" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebDevelopment</a> <a href="https://social.vivaldi.net/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CSS</a> <a href="https://social.vivaldi.net/tags/directives" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#directives</a> <a href="https://social.vivaldi.net/tags/import" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#import</a> <a href="https://social.vivaldi.net/tags/fontface" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#fontface</a> <a href="https://social.vivaldi.net/tags/webdeveloper" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#webdeveloper</a> <a href="https://social.vivaldi.net/tags/browserextension" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#browserextension</a> Wrapping up a project for a "release" on github, I use Google Material Icons for guess what... icons! Optional methods exist to "import" the font data required for rendering the Google font in one's own creation. Typically, telling the browser which font to use is achieved via HTML <Style> or <Link> to rel="stylesheet". The at-import points to the resource URL (as contains the desired font data). The "@ font-face" directive also contains a parameter for the same type of font resource URL.Attached Screenshots: showing interface where available CSS resources are shown "collapsed/ expanded" to demonstrate that "Web Developer" (the browser extension) identifies the URL pointing to the google resource under the at-import directive, but not the at-font-face which appears in the same, local .css file. What do we make of this phenomenon? Note: the CSS Resource locations: "wsldebian" (local dev server), the CDN for Chota, and the Google Fonts URL.

FirefoxVite WebFont loading error in Firefox: "downloadable font: rejected by sanitizer" I have ... <a href="https://stackoverflow.com/questions/79013530/vite-webfont-loading-error-in-firefox-downloadable-font-rejected-by-sanitizer" rel="nofollow noopener noreferrer" target="_blank">https://stackoverflow.com/questions/79013530/vite-webfont-loading-error-in-firefox-downloadable-font-rejected-by-sanitizer</a> <a rel="nofollow noopener noreferrer" class="mention hashtag" href="https://mastodon.social/tags/css" target="_blank">#css</a> <a rel="nofollow noopener noreferrer" class="mention hashtag" href="https://mastodon.social/tags/firefox" target="_blank">#firefox</a> <a rel="nofollow noopener noreferrer" class="mention hashtag" href="https://mastodon.social/tags/vite" target="_blank">#vite</a> <a rel="nofollow noopener noreferrer" class="mention hashtag" href="https://mastodon.social/tags/font-face" target="_blank">#font-face</a> <a href="https://awakari.com/pub-msg.html?id=Ir3L9UFldZaCn9PiGHlwVtwG000" rel="nofollow noopener noreferrer" target="_blank">Event Attributes</a>

pablolarah🟤🔴 How I Solved My Font Rendering Problem by Michelle Barker <a href="https://front-end.social/@michelle" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@michelle</a> @MicheBarks <a href="https://mastodon.social/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#css</a> <a href="https://mastodon.social/tags/webfonts" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#webfonts</a> <a href="https://mastodon.social/tags/typography" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#typography</a> <a href="https://mastodon.social/tags/fontface" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#fontface</a> <a href="https://css-irl.info/how-i-solved-my-font-rendering-problem/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://css-irl.info/how-i-solved-my-font-rendering-problem/</a>

We Are Brisbane / ???I'm going to give this JetBrains Mono font a try for my code and commanline for a bit. Looks pretty decent. <a href="https://www.jetbrains.com/lp/mono/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://www.jetbrains.com/lp/mono/</a><a href="https://bne.social/tags/Typography" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Typography</a> <a href="https://bne.social/tags/fonts" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#fonts</a> <a href="https://bne.social/tags/FontFace" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#FontFace</a> <a href="https://bne.social/tags/Typeface" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Typeface</a> <a href="https://bne.social/tags/font" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#font</a> <a href="https://bne.social/tags/code" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#code</a> <a href="https://bne.social/tags/MonoSpace" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#MonoSpace</a>

pablolarah🟣🟡 The new @ font-face syntax by Ollie Williams @hypeddev <a href="https://mastodon.social/tags/fontface" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#fontface</a> <a href="https://mastodon.social/tags/VariableFont" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#VariableFont</a> <a href="https://mastodon.social/tags/ColorFont" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#ColorFont</a> <a href="https://mastodon.social/tags/webdev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#webdev</a> <a href="https://mastodon.social/tags/css" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#css</a> <a href="https://fullystacked.net/posts/new-font-face-syntax/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://fullystacked.net/posts/new-font-face-syntax/</a>

pablolarah🔴🔵🟡🟢 Self-hosting fonts explained (including Google fonts) font-face tutorial by Kevin Powell @KevinJPowell <a href="https://mastodon.social/tags/fontface" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#fontface</a> <a href="https://mastodon.social/tags/webfont" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#webfont</a> <a href="https://mastodon.social/tags/GoogleFonts" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#GoogleFonts</a> <a href="https://youtu.be/zK-yy6C2Nck" rel="nofollow noopener noreferrer" target="_blank">https://youtu.be/zK-yy6C2Nck</a>

Recent searches

Search options

Administered by:

Server stats:

#fontface