Alcuni rompicapo matematici e atomici di fine anno (tratti da un post pubblicato su Telegram da mensnucleare
(t.me/mensnucleare/415) per chiunque voglia cimentarsi.
Per un 2026 ricco di fissioni!
#gonuclear
Please, consider and easier way to switch between accounts and provide landscape image on device rotation.
I'm trying to code an accessibile sortable list widget.
It works quite well using a keyboard and a screen reader, but feedbacks would be really appreciated. #a11y
Demo: codepen.io/fcalderan/pe...
Absolutely.
My wife was diagnosed a breast cancer, but she underwent all the necessary medical treatments and now she is fine.
But it was a tough year, I'm glad it's over.
Venice, San Marco Place at sunset
Venice, San Marco Place at sunset
Venice, San Marco Place at sunset, today.
screenshot of the GUI which shows the syntax and makes the syntax interactive
Chromium: Intent to Ship in v133
#CSS `text-box`, `text-box-trim` and `text-box-edge`
groups.google.com/a/chromium.o...
this feature is RAD.
try it in Canary with this syntax explorer visualizer tool I'm hackin on
codepen.io/argyleink/fu...
I was finally able to generate a chart about the Italy's grid consumption for the last 23 hours.
Next step is just to automate this, once per day.
Joeri has a dedicated website which gives you an overview of the major techniques used to make web sites and web applications without making use of build tools or frameworks.
plainvanillaweb.com
You should check it out.
It's literally the most recent technology we have to generate electricity.
CSS for detecting device posture 🥼
@media (device-posture: folded) {
h1 span:first-of-type { opacity: 0.25; }
}
some cool future opportunities 🤙
Wait, is there no bookmark functionality in bluesky or am I missing something?
Seriously, I thought Mike Portnoy was the best drummer in the world but Ben Shanbrom is definitely the most amazing drummer in whole galaxy, he can't be human.
m.youtube.com/watch?v=aUd0...
A #CSS -only version of minesweeper (but made with sharks 🦈) using custom props and style queries.
You can arrange the sharks as you prefer to make a new pattern, the cells around with the hints will automatically update.
Codepen
codepen.io/fcalderan/fu...
🚀 New Interactive Article: Overflow Clip
Explore how overflow: clip works in CSS and see why it’s useful with practical examples and demos.
🔗 ishadeed.com/article/over...
The two options for getting a semitransparent version of currentColor: box-shadow: 0 1px 2px rgba(from currentColor r g b / .35); box-shadow: 0 1px 2px color-mix(in srgb, currentColor 35%, #0000);
#tinyCSStip
Want the shadow of an element or some other visual to be a semitransparent version of the `currentColor`, which was given as a hex or keyword value?
No need to convert to rgb() or hsl() anymore!
#CSS
Ho creato un canale su Telegram, una raccolta curata di notizie sul mondo dell'energia #nucleare, informazioni e materiale divulgativo.
Se volete dare un'occhiata e/o iscrivervi il link è t.me/mensnucleare
As of Chrome 131 you have more options to style `<details>` and `<summary>`.
You can now use of the `display` property on these elements, and also use a `::details-content` pseudo-element to style the part that expands and collapses.
developer.chrome.com/blog/styling...
Screenshot of the page with a "broken" stamp on it.
For this edition of the CODE100 challenge, I built a web site with tons of accessibility issues. Send us your report what is broken and secure your place in the CODE100 final next year at the WeAreDevelopers World Congress.
www.wearedevelopers.com/magazine/fin...
A declaration block in CSS with the rules display: grid and grid-template-columns: repeat(auto-fit, minmax(var(--min, 30ch), 1fr));
One of my favorite 2-line #CSS snippets:
it creates a responsive grid layout with columns that automatically adjust in size. Each column has a minimum width of --min (`30ch` in the example) and expand up to `1fr` to fit the available space.
Code in action: codepen.io/fcalderan/fu...
Codepen link: codepen.io/fcalderan/pe...
A #CSS hover effect by animating the grid-template-columns and gap properties of a 2-column grid element:
.link {
grid-template-columns: auto var(--len, 0fr);
gap: var(--gap, 0);
transition: .33s;
&:is(:hover, :focus) {
--len: 1fr;
--gap: .5rem;
}
Code in the reply 👇🏻
