Scott and Wes run through eight new CSS, JS, and HTML features landing in browsers; including the relative alpha() color function, the progress() function for calculating values between units, Promise.allKeyed(), and native camera and microphone elements. They also get into an upgraded attr(), shrink-to-fit containers, and text-box-trim for finally killing that annoying extra space above your text.
<h3 class="code-line"><a></a>Show Notes</h3>
<ul>
<li class="has-line-data"><a href="#t=00:00">00:00</a> Welcome to Syntax!
<ul>
<li class="has-line-data"><a href="https://recent-web-feature-examples.wesbos.chatgpt.site/">Wes’s Demo Site</a></li>
</ul>
</li>
<li class="has-line-data"><a href="#t=00:22">00:22</a> CSS Alpha() Relative Color Function
<ul>
<li class="has-line-data"><a href="https://groups.google.com/a/mozilla.org/g/dev-platform/c/AqwTSNH6gkk/m/yBAzWz9_CAAJ?pli=1">Google Groups</a></li>
</ul>
</li>
<li class="has-line-data"><a href="#t=02:25">02:25</a> Brought to you by <a href="https://sentry.io/syntax">Sentry.io</a></li>
<li class="has-line-data"><a href="#t=02:48">02:48</a> CSS CSS Progress() Function: Calculate Values Between Units</li>
<li class="has-line-data"><a href="#t=05:09">05:09</a> Promise.allKeyed(): Object-Based Promise Resolution</li>
<li class="has-line-data"><a href="#t=06:55">06:55</a> Camera and Microphone HTML Elements</li>
<li class="has-line-data"><a href="#t=09:24">09:24</a> Advanced CSS Attr() Function: Props for CSS</li>
<li class="has-line-data"><a href="#t=11:25">11:25</a> CSS Sibling-Index() and Sibling-Count() Functions</li>
<li class="has-line-data"><a href="#t=13:56">13:56</a> CSS Shrink-to-Fit Container</li>
<li class="has-line-data"><a href="#t=15:36">15:36</a> CSS Text-Box-Trim and Text-Box-Edge</li>
</ul>
<h3 class="code-line"><a></a>Hit us up on Socials!</h3>
Syntax: <a href="https://twitter.com/syntaxfm">X</a> <a href="https://www.instagram.com/syntax_fm/">Instagram</a> <a href="https://www.tiktok.com/@syntaxfm">Tiktok</a> <a href="https://www.linkedin.com/company/96077407/admin/feed/posts/">LinkedIn</a> <a href="https://www.threads.net/@syntax_fm">Threads</a>
Wes: <a href="https://twitter.com/wesbos">X</a> <a href="https://www.instagram.com/wesbos/">Instagram</a> <a href="https://www.tiktok.com/@wesbos">Tiktok</a> <a href="https://www.linkedin.com/in/wesbos/">LinkedIn</a> <a href="https://www.threads.net/@wesbos">Threads</a>
Scott: <a href="https://twitter.com/stolinski">X</a> <a href="https://www.instagram.com/stolinski/">Instagram</a> <a href="https://www.tiktok.com/@stolinski">Tiktok</a> <a href="https://www.linkedin.com/in/stolinski/">LinkedIn</a> <a href="https://www.threads.net/@stolinski">Threads</a>
Randy: <a href="https://twitter.com/randyrektor">X</a> <a href="https://www.instagram.com/randyrektor/">Instagram</a> <a href="https://www.youtube.com/@randyrektor">YouTube</a> <a href="https://www.threads.net/@randyrektor">Threads</a>

Podurama

Home

Trending

Personal

Your Podcasts

New Episodes

My Files

Favourite Episodes

Tags (Folders)

Recently Played

Bookmarks

Followed Playlists

1033: 8 New CSS, JS and HTML Features You Should Know

Syntax - Tasty Web Development Treats

AI Chapters

AI Insights

Reviews