Álvaro Montoro

Watched The Bad Guys 2 with the kids. It was entertaining, some laughs, and many good action scenes (many of them unbelievable, but still.)

The old way vs. The new way | comiCSS Get more from comiCSS on Patreon

Next Monday's comic is available on Patreon (follow me and it will unlock for free): www.patreon.com/posts/old-wa...

#comic #earlyAccess

From experience, theory questions don't work well. Ask the candidate to build a component, or provide a code sample and ask them to improve it. It doesn't have to be anything big or complicated. They'll have to showcase they understand and are able to apply the theory.

That's not reassuring 😅

Template - Pyramid of Greatness | comiCSS Get more from comiCSS on Patreon

I turned the CSS Pyramid of Greatness into a template, so it can be easily modified into a "Whatever Pyramid of Greatness."

Open post with more information on Patreon: www.patreon.com/posts/136012...

CodePen to generate a blank pyramid: codepen.io/pen?template...

#ParksAndRec #pyramid #joke

What do you need most from WebKit (the rendering engine for Safari that runs your HTML, CSS, JS, and more)?

If you are making websites, what could we do in WebKit to make it easier for you to create fantastic experiences for your users?

Support for custom form controls (e.g. styling of <select>) would be nice.

Me (to a friend): This medicine worked miracles for me.

Government: Practicing medicine without a license or the proper education? You are in BIG trouble.

OpenAI (to the world): Ask whatever health questions you have, we've got the answer for you.

Government: I don't see anything wrong with this.

In about an hour, I'll be presenting my talk Algorithm Design for Web Developers in room D2 here at #DevUp. Join me and we'll go back to basics on algorithms: classifying them, assessing them, and why that matters. See you there!

The bright side of Google Fiber going at 10Mbps instead of 1000Mbps: it has struggled with some things, but overall it was able to hold well a day of videoconferences and video streaming. Changing companies or downgrading the service would have an impact, but it wouldn't be terrible.

[School group]
Teacher assignments will be emailed at 1pm, August 7

[pre August 7 x99]
Parent 1: when will we know the teachers?
Parent 2: August 7 at 1pm

[August 7, 7am]
Parent 3: when will we know the teachers?
Parent 4: at 1pm

[August 7, 11am]
Parent 5: why didn't I get the teacher email yet?!

Panel 1: Bus driver saying "Don't make me tap the sign" Panel 2: The bus driver tapping a sign that says "Engineers must review all AI generated code"

Been seeing an uptick in what are clearly vibe-coded PRs. On the surface this seems great -- more contributors!

But in the reality it's often AI slop that the person hasn't reviewed and instead the burden of review is on us, the maintainers -- which is a horrible trade.

If you're new to CSS, one of the best ways to make your life easier is to take advantage of all the CSS debugging features in your devtools.

To help, I teamed up with @amitsheen.bsky.social to create a free, 5-part beginner course on getting started with them: devtoolsforbeginners.kevinpowell.co

...or it may be time to ditch the elevator music and get a mechanical keyboard 😅

Me: *posts live coding videos on YouTube, most of them with elevator music, some of them with commentary*

Crickets...

Some random teenager YouTuber: *copies my content, adds mechanical keyboards sounds, posts them on, passes as the author*

Tons of engagement.

---

I may be too old for this.

YouTube video by Alvaro Montoro CSS Art: Drawing a mouse with CSS

New video live coding a CSS drawing
youtu.be/qlgFBTsTT6o?...

The source code is on CodePen: codepen.io/alvaromontor...

#css #html #cssArt #webDev

HTML popovers shown on interest should be accessible on mobile devices | utilitybend A new HTML feature, popover=hint, lets developers create hover-triggered popovers. This article is all about the accessibility on touch devices.

🚀A new HTML feature, interestfor, allows for hover-triggered popovers. But how do they work on touch? The article shows different solutions for making them accessible on touch devices, and my thoughts on them. Share your thoughts! #HTML #webdev #accessibility #openui

utilitybend.com/blog/html-po...

Parks & Recreation - Swanson Pyramid of Greatness (Template) Template for a parody of Parks and Recreation's Swanson Pyramid of Greatness. Fill it in and create your own. It includes a trick to adjust text size ...

The other day, @comicss.art shared the CSS Pyramid of Greatness, based on a Parks and Recreation joke. I cleaned up the HTML, added some instructions, and made it into a blank template so it's easy to modify (the core is basically a styled UL).
codepen.io/alvaromontor...

#parksAndRec #css #html

🚨 New Course Alert 🚨
DevTools for Beginners

@kevinpowell.co and I just released a brand new (and totally free!) email course all about DevTools and how to use them in ways that actually help you debug and improve your CSS.

🔗 Full details and free signup here: devtoolsforbeginners.kevinpowell.co

I happen to have way too many XXXL (Triple X) Gray @codepen.io T-shirts. If that's your size, DM me your address and I'll send ya a couple.

Almost... Just a XXL here 😳

'Thou shalt not make a machine to counterfeit a human mind.'

The many ways to write a color in CSS Hi! My name is Cyan, and I am a Color. I'm not as popular as I used to be -not trying to brag, but I was a hit on the Internet in the 90s & early 2000s-, and I am still quite eye-catchy: With the many...

alvaromontoro.com/blog/67916/t...

Cyan could be written in 78 different ways in 2020 (not counting fallbacks or the color() function), and that number has only increased since then. Now it's well above a hundred. The article needs an update.

I've tried pug in the past. It works nice. But what I wish existed is a native HTML solution.

Cartoon with 4 panels in a 2x2 grid titled "CSS Short Names". It shows different people (all seem happy but the last one who looks annoyed) saying: - Hello! My name is text-emphasis: sesame, but my friends call me Tess. - Hi, I'm shape-inside: auto, but people call me Sia for short. - Howdy, my name is text-orientation: mixed, and people call me Tom. - My name is align-self: stretch... and I hate this conversation. At the footer of the cartoon it says "comiCSS: a webcomic about CSS. Coded with [heart-symbol] in CSS. comicss.art"

The components library allows for over 3,000,000 people combinations (not all of them work great, reducing it considerably to "just" thousands).

Here's a silly joke I shared the other day, in comic form. The process that before implied tons of copy-pasting and CSS editing, is now 20 lines of HTML.

"Declarative Custom Elements" has a nice ring to it :P

That is a good question. I'd prefer light, but I see how shadow DOM could encapsulate it better.

I'm in this post, and I hate it.

That's the thing. This component does not use JS, it doesn't need JS, why having to add even a small JS snippet to define it?

Or better for reusability and maintainability, define a component DTD (CTD), and do something like this:

<link rel="ctd" href="my.card.component.definition">

...

<a-card link="..." imageSrc="..." alt="..." heading="..." body="..."></a-card>