| Website | https://pepelsbey.dev |
| Bluesky | https://bsky.app/profile/pepelsbey.dev |
| https://www.linkedin.com/in/pepelsbey | |
| Telegram | https://t.me/pepelsbey_dev |
The Layout Maestro, a practical CSS course on building web layouts. @shadeed9’s course teaches how to think about layout decisions, not just syntax. It covers Flexbox, Grid, container queries, and :has() through visual lessons and interactive demos, helping you build resilient layouts that don’t break when content or screen size changes. #css #learn
🚨 Want mixins in CSS?
Help the @csswg by telling us what feels natural to you!
Look at the code in the screenshot. What resulting widths would you find least surprising?
A: All get 100px
B: div gets 100px, div > h2 gets 200px, div + p gets 300px
C: div gets 100px, div > h2 gets 200px, div + p gets no width*
D: div and div > h2 get 100px, div + p gets no width*
* from the mixin
Poll in https://front-end.social/@leaverou/116297811172593173
Please answer based on what feels natural *to you*, it's not a quiz.
I can finally quickly test adaptive layouts in Firefox’s new Split View mode. For more advanced testing, there’s https://polypane.app, of course. But there are many other simpler side-by-side use cases. Yay!
As Large Language Models (LLMs) become increasingly synonymous with “AI”, and are used by people within our community, we want to highlight considerations around different ways in which LLMs can be useful or problematic when it comes to leveraging them in standards work at W3C.
Firefox 149 is out now, and adds bunch of new web platform features, such as:
🎉 The CloseWatcher API
🎉 popover=hint (although I'm concerned about the spec'd behaviour)
🎉 hasUAVisualTransition on PopStateEvent
🎉 font-family: math
🎉 The CSP reporting API
And more!
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/149
Firefox 149 release notes for developers. The release adds the popover="hint" value, CloseWatcher for custom closeable components, shape-outside support for xywh(), vertical-align as a shorthand property, optional @​container query conditions, HTMLSelectElement.showPicker() for <datalist> elements, and HTMLMediaElement.captureStream(). #firefox #browser
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/149
Gecko matters because it ensures there’s an independent voice shaping how the internet evolves. Without Gecko, the landscape would be dominated by Apple and Google alone. Is that really the ...
A deep dive into the CSS architecture behind utilitybend.com: cascade layers, a three-tier design token system, light-dark() for dark mode, a modern reset, container queries, logical properties, and progressive enhancement as a structural principle.
CSSkit, a high-performance CSS toolchain written in Rust. @keithamus’s project combines CSS parsing, minification, linting, formatting, transpilation, bundling, and analysis into one tool with zero configuration. It also includes LSP integration for IDE support. The project is inspired by oxc and is currently in alpha. #css #tools
Web Standards
Lea Verou, PhD
Firefox for Web Developers
W3C Advisory Board
Brecht