| 🔗 Website | https://sarasoueidan.com |
| 💌 Newsletter | https://sarasoueidan.com/newsletter |
| 🎥 Accessibility course | https://practical-accessibility.today |
| Interests | #HTML #CSS #a11y #ProgressiveEnhancement #InclusiveDesign |
Now we have text-box in CSS, understanding font metrics is even more important so you know what you’re trimming. This is a very handy little website that allows you to upload a font that you plan on using, along with a Google font picker.
Seeing #CSS carousels being promoted as accessible again, so here is a periodic reminder:
#CSS carousels are not "accessible by default" https://www.sarasoueidan.com/blog/css-carousels-accessibility/
They are still highly experimental and there are still many open #accessibility questions & issues being discussed.
+The browser will not do everything for you—you'll still have work to do, too.
@Kilian Hey!
I zoomed this page in https://private-user-images.githubusercontent.com/41970/386514661-67d54005-70ce-4a65-9807-892ec91194d8.svg?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3NDk3MjQ2MzMsIm5iZiI6MTc0OTcyNDMzMywicGF0aCI6Ii80MTk3MC8zODY1MTQ2NjEtNjdkNTQwMDUtNzBjZS00YTY1LTk4MDctODkyZWM5MTE5NGQ4LnN2Zz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTA2MTIlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwNjEyVDEwMzIxM1omWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTUyODRlMjZlMzhlZGU4MjNjNGE2ZGJmNmU5MjAzMjczODFiNzNkNDVmMjFjZjc0NTFlNWQzMmJiNGIwZmRjZjgmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.ij_njGed2xaE0axTYXfMNZMo6LmEnARVTN5aGyU8-kA and noticed the icon got distorted (similar to what you see on the right in this screenshot)
To prevent this, may I suggest adding stroke-width and vector-effect="non-scaling-stroke" to the border? That ensures that zooming in won't scale the width of the border with the size of the icon.
Here's the repo for the new logo: https://github.com/CSS-Next/logo.css?tab=readme-ov-file#an-official-logo-for-css
Here's an outline version of the logo from Killian https://kilianvalkhof.com/2024/css-html/an-outline-version-of-the-new-css-logo/
(I also remember seeing one more link to a similar logo asset somewhere but I lost that. Please share any more assets you might have in the replies!)
The story of how the latest #CSS logo came to be:
"Kind of Rebeccapurple" https://www.ondrejkonecny.com/blog/kind-of-rebeccapurple/
I had missed this writeup. It's been great reading it to get a short history of how the logo evolved into what it came to be.
Really looking forward to Safari finally implementing support for `content` on `::marker` now that it is part of Interop 2025.
It's been long overdue.
Piccalilli
James Edwards