Today's lunch video is "Wrapper Classes: A Layout Foundation" - "I have a blue background that is stuck because all of my content is in my `<main>` element, which has a width on it. I want my blue background to escape outside, so let's make that happen." #CSS https://www.youtube.com/watch?v=tr7EH48TFiE

CSS Tip!

A simple CSS code to smoothly stop the rotation of your element on hover. The rotation will resume smoothly on mouse-out as well.

https://css-tip.com/stop-rotation/

I scream with the rage of a thousand suns.

It only took 6 months of casual Neocities usage to enjoy writing my HTML/CSS from scratch better than using Wordpress.

BritCSS: Write CSS With British English Spellings - Everyone knows that there is only one proper English, with the rest being mere der... - https://hackaday.com/2025/03/13/britcss-write-css-with-british-english-spellings/ #thedeathoftheenglishlanguage #internethacks #css

amazing what a few lines of #CSS can do

https://codepen.io/argyleink/pen/LEYOgxy

i remember reading a while back, a good article on the tradeoffs of loading #css conditionally in multiple files (& only loading it on page when used & the extra network requests that results in) vs. placing that css all in one file.. #webdev #frontend - any ideas?

From the CSS Working Group meeting today…

RESOLVED: Add a 'size' shorthand property (for 'width'/'height'), no relation to @page's 'size' descriptor

Animating a height from zero to auto used to be a pain on the web, but now that we have a pure #CSS solution rolling out across browsers, it's a piece of cake.

But now I find myself trying to the same in #ReactNative and - fuck me - it's hard.

It's times like this that I realise how spoilt web devs are by all the wonderful things the web platform can do nowadays.

Step 1: Take a previously single-div drawing

Step 2: Copy the code into a custom toggle switch

Step 3: ???

Step 4: Profit

---

Source code on https://codepen.io/alvaromontoro/pen/ZYEXGeB

this is it, folks! we are in the final week before submissions are due for GOOD INTERNET, a new print periodical magazine about all the things that make the #web fun: things like the #smallweb, the fediverse, the #indieweb, and efforts to actively fight #enshittification. submissions are open until MARCH 15.

check the submission guidelines or sign up for email alerts to be notified when we publish in may!

https://goodinternetmagazine.com

if this is your first time hearing about this, you still have enough time to come up with and write an article or complete a digital #art piece, if you're passionate about the #internet and want to write about it! :) bloggers, it's your time to shine!~

i can't wait to show y'all the incredible stories that have been submitted from all over the 'net, and some of the coolest art i've seen about the web!

thank you to everyone who's been so supportive of this project already. this is why this side of the internet is amazing. please boost, if you can; i want to make sure i did everything i could to include as many diverse voices as i can.

thank you!

original post: https://tilde.zone/@xandra/113913277766098384

Currently working on a project that involves going back to raw #html and #css. No page builders, JS or frameworks.

It's been a long time so I'm brushing up - yes, there are a lot of fancy features coming out (and I can't wait to try them out) but the core of HTML is still there, being awesome.

It's been too long. Everyone should go and build something in HTML right now.

The second part is live!

This time, I am using scroll-driven animation to create the star rating component! It's a good exercise to discover some modern features.

https://css-tricks.com/a-css-only-star-rating-component-and-more-part-2/ via @csstricks

Single element and 100% CSS magic!

Do you want a ribbon shape for your next project? I have created more than 100 different designs!

https://css-generators.com/ribbon-shapes/

One element per shape
Optimized with CSS variables
One-click to copy the code

The cupid I drew won DEV's February CSS Art challenge

Check out the code on @codepen at https://codepen.io/alvaromontoro/pen/raNOqdJ

CSS Tip!

One property and two gradients to add a transparent inner border to image elements.

https://css-tip.com/inner-border/

Since 2009, I've been contributing to open web tools & standards, with a focus on CSS and related platform features at the W3C. But that work takes resources, making it hard for independent contributors like us @OddBird to stay involved.

We need support. If you appreciate what we're doing, you (or your company) can sponsor our work directly:

https://opencollective.com/oddbird-open-source

Let's keep building an open web for everyone.

A new animated single-element toggle switch for the collection: rain
https://codepen.io/alvaromontoro/full/MYWmppe