bramus

joshtumath, 4 days ago to random

Woohoo! It's #CSSDay in Amsterdam again tomorrow. Looking forward to seeing everyone there and for some more awesome talks!

And I've just found out my hotel that @hdv recommended to me has hot tubs on the roof! Yesss.

bramus, 4 days ago to random

This is the non-grid-based version that is getting prototyped.

See https://developer.chrome.com/blog/masonry?hl=en for some backstory and https://tabatkins.github.io/specs/css-masonry/ for an unofficial proposal draft.
https://botsin.space/@intenttoship/112555546428987427

argyleink, 4 days ago to random

Hi Amsterdam

bramus, 4 days ago to random

Happening this week! See you there?
https://mastodon.social/@KrijnHoetmer/112531444107452403

mia, 5 days ago to random

Heading to Amsterdam. I wonder if there will be anyone else there, maybe for a conference or something? You never know.

It would be impossible to predict. 🤷🏻‍♀️

#cssday

marcamos, 8 days ago to random

@bramus Have you come across anyone using the technique you've written up here ( https://scroll-driven-animations.style/demos/scroll-shadows/css/ ), but on the x-axis?

I'm trying to adjust and utilize your wonderful code for horizontally-scrolling table wrappers, but failing to make it work.

I appreciate the YT video playlist on the topic!

pawelgrzybek, 9 days ago to random

📝 New post

Top picks — 2024 May

https://pawelgrzybek.com/top-picks-2024-may/

After over 9 years of publishing top picks in an unchanged format, I decided to change it slightly. This edition features work by @stefan @matthiasott @kizu @bramus @deno_land @samwho and others 🫶

bramus, 9 days ago to random

⭐️ Scroll-Driven Animations with CSS (2024.05.30 @ WebExpo)

Slides of the talk “Scroll-Driven Animations with CSS” I gave at @webexpo today.

https://www.bram.us/2024/05/30/scroll-driven-animations-with-css-webexpo/

#CSS #ScrollDrivenAnimations #PublicSpeaking

pawelgrzybek, 9 days ago to random

I think I found a bug in Safari. There is an issue with background-sizes defined using lh (line-height) units.

👍 Chrome
👍 Firefox
👎 Safari/Safari Technology Preview

CodePen to reproduce an issue:
https://codepen.io/pawelgrzybek/pen/ExzZOvG

I would love to participate, make the web a better place, open a bug, and help browser engineers to fix it, but I don’t know where to start. Could you point me in the right direction, lovely browser people, please?

@bramus @jensimmons @rachelandrew @pepelsbey @rachelandrew

bramus, 9 days ago to random

Congrats to @webexpo on organizing their annual conference!

Things went very smooth and the talks I attended all smashed it.

It's been an honor to speak at this WONDERFUL venue and to have been part of the AMAZING line-up they had.

#WebExpo #ChromeDevRel #PublicSpeaking

View from the stage
Behind the scenes

Kilian, 10 days ago to random

@​starting-style lets you animate the "un-animatable" (like animating from a display:none) by setting the initial state of the animation.

I couldn't help myself so the Elements panel in Polypane now supports inspecting and editing it. 🤩

Pretty cool considering both Chrome and Safari devtools can't do that yet. 😎

A popover with starting style that's opened with a slide-down animation. Then the CSS gets edited and now its opened with a rotation.

matuzo, 10 days ago to random

Netlify wanted to charge me $55 again (they didn't) for HTMHell. They told me that I'm using up more than 100GB of bandwidth, mostly because of the RSS feed (70GB). The file is 2.7MB uncompressed.
Is that possible? Am I doing something wrong or incredibly right? :D

https://www.htmhell.dev/feed.xml

bramus, 11 days ago to random

🥹

Very exciting news! This is the thing that gives Custom Properties their SUPERPOWERS.

Yes, you can use them to enforce type safety, limit their inheritance, and set up a default but what I like most about them is that YOU CAN ANIMATE/TRANSITION REGISTERED CUSTOM PROPERTIES.

https://botsin.space/@intenttoship/112519846001484140

SaraSoueidan, 11 days ago to random

Ohhh it's the week before the conference talk and so the panic attacks are starting.

I'd forgotten about these. 🥲

bramus, 12 days ago to random

After a wonderful #JSHeroes2024 last week followed by a quick pit stop at home, I'm hopping onto the next plane to fly to Prague.

I'm scheduled to give a talk at #WebExpo on Thursday, covering Scroll-Driven Animations.

#ChromeDevRel #PublicSpeaking #ConferenceSeason

pixelambacht, 13 days ago to Fashion

✨FASHION FACT✨ I'm not sure exactly what I'll wear to #CSSDay, but I know it's going to be covered in cat hair.

#fashion #update

bramus, 14 days ago to random

🙄
https://mastodon.social/@owa/112456604284008093

davatron5000, 15 days ago to random

@view-transition {  
 navigation: fire;  
}  

when? /cc @bramus

bramus, 15 days ago to random

I came prepared … 🩳🩴

But turns out the pool wasn't expecting me 😅

#JSHeroes2024

jvhellemond, 21 days ago to random

Been chasing a short circuit somewhere in the house for days, but I think I found the culprit:

leaverou, 21 days ago to random

We’ve always told devs that browsers prioritize what to implement based on dev demand.

There is one exception: #SVG.

SVG is used on >65% of websites. Yet, browsers have been refusing to work on SVG, ignoring pressure and pain points from web devs.

#StateOfHTML showed SVG as the top content pain point: https://2023.stateofhtml.com/en-US/features/content/#content_pain_points

Tons of work (SVG 2, fill & stroke, and more) has sat unimplemented for years. At this point, in standards circles, we know not to touch SVG with a barge pole.

[1/2]