2026-07-28T04:28:52+02:00 https://nostr.ae MDN Web Docs https://nostr.ae/npub1azl49z5aacf56hgus0xn95fhrtmvuy9kmj6lnczk979pwsdddulqqntw5z https://files.mastodon.social/accounts/avatars/000/292/770/original/a37f5333aaa28bf4.png https://files.mastodon.social/accounts/avatars/000/292/770/original/a37f5333aaa28bf4.png https://nostr.ae/nevent1qqs23422kf5yx6d8arnqcwz6ever9ywsmkjy3rzfd87h4gsys5j2cmszyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnujkqgfg Have you heard of CSS Subgrid? 🤔<br/><br/>A grid item can now pass its parent&#39;s grid lines to children, so nested elements align perfectly with the outer layout.<br/><br/>No more hacky workarounds for aligned nested grids.<br/><br/>Learn more 👇<br/><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Subgrid">https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Subgrid</a><br/> <img src="https://files.mastodon.social/media_attachments/files/116/557/717/167/666/840/original/a2d3905c2f0d9e2c.png"> <br/> 2026-05-11T22:00:20+02:00 https://nostr.ae/nevent1qqszv3esgcvq3n5kmaszyj7hvc338werw7kf7hfllshsk2vsn7wdj2gzyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnu0gl8vu 🆕 The URL Pattern API is Newly Available!<br/><br/>Use it to match and extract parts of URLs, no need to reinvent routing logic. Supports literals, wildcards, named groups, and even regex constraints.<br/><br/>Learn how it works 👇 <br/><a href="https://developer.mozilla.org/en-US/docs/Web/API/URL_Pattern_API">https://developer.mozilla.org/en-US/docs/Web/API/URL_Pattern_API</a><br/> <img src="https://files.mastodon.social/media_attachments/files/116/555/359/362/263/724/original/be4b13a7bee96c1e.png"> <br/> 2026-05-11T12:00:44+02:00 https://nostr.ae/nevent1qqsvfr9xlv4hmyl75lcdv0lex5r95sdy0fa404zucrrgfghr05q8m4gzyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnuman3a2 Mozilla Meetup is back in Berlin! 🥳 <br/><br/>🗓️ Apr 28 // 18:00<br/><br/>Firefox, open source &amp; the future of the web.<br/>🎤 Firefox Mobile open source contributions<br/>🗺️ Firefox Roadmap &amp; upcoming features<br/>🤝 Networking + raffle<br/><br/>RSVP now! 👇<br/><a href="https://www.meetup.com/berlin-mozilla-meetup/events/314422227/">https://www.meetup.com/berlin-mozilla-meetup/events/314422227/</a><br/> <img src="https://files.mastodon.social/media_attachments/files/116/464/760/544/704/318/original/9715deeed3f4c6ec.png"> <br/> 2026-04-25T12:00:15+02:00 https://nostr.ae/nevent1qqszppesea0y2ruwj73kaudjjzfvvsay85x0s3vmj4w2tputx7wz0xczyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnu0j9wmf The &lt;dialog&gt; element handles modals the right way 🪟<br/><br/>Built-in focus trapping, backdrop styling, and Escape key handling. No more custom modal libraries.<br/><br/>⋅ .showModal() for modal dialogs<br/>⋅ .show() for non-modal<br/>⋅ ::backdrop for overlay styling<br/><br/>Learn more 👇<br/><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/dialog">https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/dialog</a> 2026-04-16T23:00:11+02:00 https://nostr.ae/nevent1qqsvvr97ckdmlqytstw5a0k88gduxp9qhew6q6g5rzthzllv5jwtyqqzyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnul9wctk Need to detect when elements enter the viewport? 👀<br/><br/>IntersectionObserver fires a callback when elements cross a visibility threshold. No more scroll event listeners.<br/><br/>⋅ Lazy-load images<br/>⋅ Track ad visibility<br/>⋅ Trigger scroll animations<br/><br/>Learn more 👇<br/><a href="https://developer.mozilla.org/en-US/docs/Web/API/IntersectionObserver">https://developer.mozilla.org/en-US/docs/Web/API/IntersectionObserver</a><br/> <img src="https://files.mastodon.social/media_attachments/files/116/399/408/066/988/347/original/edcbc7f3966e8fc3.png"> <br/> 2026-04-13T23:00:15+02:00 https://nostr.ae/nevent1qqsyg538l8uyt6pqypttxwzn46d3n00f4uzuyz4u4965d0cdg32exfszyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnuh40xy8 From 2-min dev server starts to 2s ⚡<br/><br/>We rewrote MDN&#39;s entire frontend, ditching the React SPA for Lit web components, server components, and Rspack. The result: less JS shipped, scoped CSS, and a build pipeline that just works.<br/><br/>Read how we did it 👇<br/><a href="https://developer.mozilla.org/en-US/blog/under-the-hood-of-mdns-new-frontend">https://developer.mozilla.org/en-US/blog/under-the-hood-of-mdns-new-frontend</a><br/> <img src="https://files.mastodon.social/media_attachments/files/116/381/005/942/394/558/original/0945a27cfafa1f43.png"> <br/> 2026-04-10T17:00:22+02:00 https://nostr.ae/nevent1qqsg6ren5q28m04tan5xt0up6uvsqygvjw4ktf9datttapqs8yzfg8qzyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnuxtlfj2 CSS nesting is now Baseline 🎉<br/><br/>Write nested selectors directly in CSS — just like Sass, but natively.<br/><br/>.card {<br/> color: black;<br/> &amp;:hover { color: blue; }<br/> .title { font-weight: bold; }<br/>}<br/><br/>No preprocessor needed.<br/><br/>Learn more 👇<br/><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_nesting">https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_nesting</a> 2026-03-29T09:00:07+02:00 https://nostr.ae/nevent1qqsymth8kw2kdfk48r5agmm8pyn84m70jult8d6lh8gvcxyr23lcg0gzyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnu4f9zsn Creating a resolvable Promise just got cleaner 🧹<br/><br/>`Promise.withResolvers()` returns { promise, resolve, reject }<br/>No more wrapping logic inside the constructor.<br/><br/>Learn more 👇<br/><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/withResolvers">https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/withResolvers</a><br/> <img src="https://files.mastodon.social/media_attachments/files/116/195/564/481/907/958/original/28e699184fb87213.png"> <br/> 2026-03-08T22:00:09+01:00 https://nostr.ae/nevent1qqsynkyen7772vxdjp2a7f4q0v6jm7e8q8g8hldwjugdjt7x9g38p0szyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnua0yu9z Meet the CSS Custom Highlight API ✨<br/><br/>Style arbitrary text ranges without modifying the DOM.<br/>📝 Great for search results<br/>💻 Syntax highlighting<br/>📚 Text annotations<br/><br/>Learn how it works 👇<br/><a href="https://developer.mozilla.org/en-US/docs/Web/API/CSS_Custom_Highlight_API">https://developer.mozilla.org/en-US/docs/Web/API/CSS_Custom_Highlight_API</a> 2026-02-18T10:00:06+01:00 https://nostr.ae/nevent1qqs0xryexknk4tt0ltt6fytrhk5zq4qx3f3fn2qs8qey8gfmpqtqzaszyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnu0f8cdw We&#39;re exploring ways to make it easier to share specific links to sections on MDN. Which interaction feels most natural to you?<br/><br/>Vote A, or B. 🗳️<br/> <img src="https://files.mastodon.social/media_attachments/files/116/086/801/010/703/504/original/a2c5e8a66ebf038d.png"> <br/> 2026-02-17T17:00:11+01:00 https://nostr.ae/nevent1qqszfvtg2t6fs78u9x4dlntjwtdzn2jxxsm5q9lwlzk4sh26qq8m6aqzyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnu2fhp38 🆕 The URL Pattern API is Newly Available!<br/><br/>Use it to match and extract parts of URLs, no need to reinvent routing logic. Supports literals, wildcards, named groups, and even regex constraints.<br/><br/>Learn how it works 👇 <br/><a href="https://developer.mozilla.org/en-US/docs/Web/API/URL_Pattern_API">https://developer.mozilla.org/en-US/docs/Web/API/URL_Pattern_API</a><br/> <img src="https://files.mastodon.social/media_attachments/files/115/961/051/347/789/294/original/689ac3ad7e11bf9e.png"> <br/> 2026-01-26T12:00:22+01:00 https://nostr.ae/nevent1qqsgxt6sq8cf93p97t9jdccjfylldpaj88zw8az9hguquqnn7ydmlzqzyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnuf2u0l2 MDN is more than just a resource. It&#39;s a community of developers, contributors, and learners passionate about web development. <br/><br/>Contribute to,<br/>📚 MDN documentation<br/>🤝 Help other devs<br/>💟 Localize content<br/>📝 Review or write on MDN<br/><br/>Start now 👇 <br/><a href="https://developer.mozilla.org/en-US/community">https://developer.mozilla.org/en-US/community</a> 2025-12-31T14:00:09+01:00 https://nostr.ae/nevent1qqsxugz6u6m9lx8uay9ughmmuhclkhl04n89q86suewqf8v38a3yhpszyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnuztacp8 Fine-tune multilingual typography with text-autospace ✨<br/><br/>It lets you control spacing between CJK and Latin characters.<br/>&gt; text-autospace: ideograph-alpha ideograph-numeric punctuation;<br/><br/>Now available on Baseline 2025. 🎉 <br/><br/>Learn more 👇 <br/><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/text-autospace">https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/text-autospace</a><br/> <img src="https://files.mastodon.social/media_attachments/files/115/616/121/444/592/497/original/8c07bf1e3d04f947.png"> <br/> 2025-11-26T14:00:10+01:00 https://nostr.ae/nevent1qqsw94hvlfxmjr0u2j32zt0us8q8agphu7wxhc48r3pp4ywkvyx8gjszyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnu3dles8 ✨ One line of CSS. Smooth page transitions. No JavaScript.<br/><br/>```<br/>@view-transition {<br/> navigation: auto;<br/>}<br/>```<br/><br/>The 🆕 CSS View Transitions bring native animations to multi-page apps, no SPA setup needed!<br/><br/>Explore now 👇<br/><a href="https://developer.mozilla.org/en-US/blog/view-transitions-beginner-guide/">https://developer.mozilla.org/en-US/blog/view-transitions-beginner-guide/</a> 2025-10-23T13:00:06+02:00 https://nostr.ae/nevent1qqsf37cr086pdje72xlp6e73j2apkr9l5md8mf6a3kuept0wjpejvvgzyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnutdkul8 Relative color syntax is a game changer! 🎨<br/>Lighten, darken, shift hue, tweak alpha, all without manually converting color formats.<br/><br/>✅ Works with custom properties<br/>✅ Keeps your design system DRY<br/>✅ Supported in modern browsers<br/><br/>Learn more 👇<br/><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_colors/Relative_colors">https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_colors/Relative_colors</a> 2025-09-03T14:00:07+02:00 https://nostr.ae/nevent1qqsfkx7jjqx5dq0p94lh7yse5va5ya3ucdzp0s5c767ctlgkx07mgjszyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnudywsju We’ve launched MDN’s new front end — and it’s just the beginning.<br/><br/>Intentionally targeting Baseline &#34;Widely available&#34; features when deciding on which ones to use. This means we&#39;re able to adopt modern CSS and web components for our UI.<br/><br/>Check it out 👇 <br/><a href="https://developer.mozilla.org/en-US/blog/launching-new-front-end/">https://developer.mozilla.org/en-US/blog/launching-new-front-end/</a> 2025-08-25T12:00:02+02:00 https://nostr.ae/nevent1qqst28sl5j54n5nyf2tnpgkyf4h08lentv3qc5n2t3793mdgt8k5dmczyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnuprf3ez Support MDN, support the web 🧡<br/><br/>The MDN swag is live! Now you can rep your favorite dev resource with t-shirts, hoodies, mugs, and more, shipped straight to your door 🏠<br/><br/>🇺🇸 US → <a href="https://mozilla-na.myspreadshop.com/">https://mozilla-na.myspreadshop.com/</a><br/>🇪🇺 EU/UK → <a href="https://mozilla-europe.myspreadshop.ie/">https://mozilla-europe.myspreadshop.ie/</a><br/><br/>(And yes, ships internationally too!)<br/> <img src="https://files.mastodon.social/media_attachments/files/114/987/132/943/885/945/original/fb85baba71b39f6e.png"> <br/> 2025-08-07T13:00:07+02:00 https://nostr.ae/nevent1qqsfsr5ru6ls622jlyeewjeutdy8thufef80a5m7ckn9eyqjv3lplyczyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnuzzlkyj &lt;small&gt; - It’s not just about font size! 🔠<br/><br/>It is meant to represent side comments, legal disclaimers, fine print, or less prominent text, not just make things smaller visually.<br/><br/>📜 Used for:<br/>Legal disclaimers<br/>Copyright notes<br/>A11y hints, etc<br/><br/>Read more 👇<br/><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/small">https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/small</a> 2025-07-28T22:00:02+02:00 https://nostr.ae/nevent1qqswnz9tk63ydu2gahgshuquygpl7gktrpvltlerg8zfu5macd2gd7gzyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnujjyku0 CSS is CSSing<br/> <img src="https://files.mastodon.social/media_attachments/files/114/184/265/918/898/658/original/394029759c37b787.png"> <br/> 2025-03-18T17:00:28+01:00 https://nostr.ae/nevent1qqs2du4x9wx36zncwy80a88j4xjm63rkkt7fl9p4pd5y5rzxltxyvxszyr5t7552nhhpxn2arjpu6vk3xud0dnsskmwtt70q2chc596p44hnur5tnvw JavaScript’s Map is a powerful data structure designed for key-value pairs, offering better performance and flexibility than plain objects in many cases.<br/><br/>Key Advantages:<br/>✅ Preserves Key Order<br/>✅ Flexible Key Types<br/>✅ Better Performance<br/><br/>Give it a try! ↓<br/><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map">https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map</a> 2025-02-21T08:00:03+01:00