Lucas and Luna dive into the CSS View Transitions API, a new browser feature that lets developers create smooth, native-like page transitions without JavaScript libraries. They explain how it works under the hood—using pseudo-elements like ::view-transition-old and ::view-transition-new—and walk through a real example: animating a product list to a detail page. They discuss browser support, performance considerations, and why this API could change how we think about multi-page apps versus single-page apps. The episode also touches on the trade-offs with frameworks like React Router and the future of cross-document transitions. No fluff, just practical insight for frontend developers.

#CSSViewTransitions #FrontendDevelopment #WebDevelopment #CSSAPI #PageAnimations #BrowserFeatures #Chrome #Performance #SPA #MPA #ReactRouter #JavaScript #TechnologyPodcast #Technology #FexingoBusiness #BusinessPodcast #WebDev #DeveloperTools

Keep every episode free: buymeacoffee.com/fexingo

Lucas and Luna dive into CSS Subgrid, a feature that finally fixes nested grid alignment without hacky workarounds. Using a real-world example of a product card with a sticky footer and an image gallery, they show how Subgrid lets child elements inherit parent grid tracks, eliminating calc-based width juggling and JavaScript layout calculations. Lucas explains the browser support landscape as of July 2026, noting that Firefox has supported Subgrid since 2019, Chrome since 2022, and Safari since 2023, making it safe for production in most contexts. They also discuss performance gains from reducing DOM dependencies and layout thrashing, and touch on fallback strategies using feature queries. Perfect for developers tired of fighting with nested flexboxes to align content across dynamic layouts.

#CSS #Subgrid #CSSGrid #WebDevelopment #Frontend #Layout #ResponsiveDesign #BrowserSupport #Firefox #Chrome #Safari #WebPerformance #Coding #Technology #FexingoBusiness #BusinessPodcast #Podcast #WebDev

Keep every episode free: buymeacoffee.com/fexingo

In this episode, Lucas and Luna explore the practical impact of CSS Container Queries on modern responsive design. They discuss real-world examples, including how a component-based layout can adapt to its container instead of the viewport, reducing the need for media query overrides. The hosts break down the syntax, browser support as of mid-2026, and a concrete case: a card component that adjusts its layout fluidly within different grid contexts. They also touch on performance considerations and how container queries simplify code for design systems. If you're a front-end developer looking to write more maintainable styles, this is your deep dive.

#CSS #ContainerQueries #ResponsiveDesign #Frontend #WebDev #CSSGrid #DesignSystems #ComponentBased #Coding #WebDevelopment #CSSFeatures #ModernCSS #Layout #UI #Performance #DeveloperTools #FexingoBusiness #BusinessPodcast

Keep every episode free: buymeacoffee.com/fexingo

Foldable phones are no longer a novelty—they're a growing segment of the mobile market. But most web apps treat them like regular phones, missing a huge opportunity and often delivering a sluggish experience. In this episode, Lucas and Luna dive into why foldables pose unique challenges for web developers: from viewport resizing mid-session to CSS layout reflow and JavaScript performance pitfalls. They walk through a real-world case study of a news site that saw a 40% increase in layout shift when users unfolded their devices, and how a combination of container queries, content-visibility, and debounced resize handlers fixed it. If you're building for the modern web, you need to understand these quirks before your users fold you out.

#FoldableDevices #WebPerformance #ResponsiveDesign #CSSContainerQueries #JavaScriptOptimization #ViewportResize #LayoutShift #MobileWeb #TechPodcast #WebDevelopment #Frontend #Backend #ModernWebStack #FexingoWebDev #FexingoBusiness #BusinessPodcast #Technology #WebDevTips

Keep every episode free: buymeacoffee.com/fexingo

Episode 91 of The Web Development Podcast digs into CSS Container Queries, a feature that finally lets components respond to their parent container's size rather than the viewport. Lucas explains how this flips the old 'responsive design' model on its head, using a real dashboard card example. Luna questions browser support and practical adoption, and they discuss how frameworks like Tailwind and Emotion are adapting. They also touch on the performance benefits of reducing JavaScript-based resize observers. By the end, you'll understand why container queries are more than syntactic sugar—they enable truly reusable, self-contained components. This episode is ad-free thanks to listeners at buymeacoffee.com/fexingo.

#CSSContainerQueries #ResponsiveDesign #WebDevelopment #Frontend #CSS #ComponentDriven #DashboardUi #TailwindCSS #EmotionCSS #BrowserSupport #Chrome #Safari #Firefox #WebPerformance #JavaScript #Technology #FexingoBusiness #BusinessPodcast

Keep every episode free: buymeacoffee.com/fexingo

Episode 90 of The Web Development Podcast with Fexingo dives into CSS container queries — a feature that lets components respond to their parent container's size rather than the viewport. Lucas and Luna break down why this matters for reusable UI components, how it differs from traditional media queries, and a real-world example from a dashboard layout that turned a maintenance nightmare into clean code. They also discuss browser support as of mid-2026 and practical migration strategies for existing projects. If you've ever fought with nested breakpoints or duplicated styles across contexts, this episode gives you a concrete tool to simplify your responsive design.

#CSSContainerQueries #ResponsiveDesign #WebDevelopment #Frontend #CSS #UIComponents #DashboardDesign #WebDevPodcast #FexingoWebDev #Technology #WebStandards #ModernCSS #ContainerQueries #Breakpoints #ComponentDriven #CSSFeatures #WebPerformance #FexingoBusiness

Keep every episode free: buymeacoffee.com/fexingo

Episode 89 of The Web Development Podcast dives into a silent user-experience killer: how web forms inadvertently reject or interfere with password managers. Lucas unpacks the specific HTML attributes and JavaScript patterns that cause autofill failures, focusing on the autocomplete attribute, form structure, and the dangers of dynamically generated fields. Luna brings real-world data on user abandonment rates when password managers are blocked. They walk through a concrete fix using the 'webauthn' and 'username' autocomplete tokens, and discuss the broader principle of respecting user tooling. No abstract theory—just actionable code patterns that make or break login forms. If you've ever wondered why your password manager works on some sites but not others, this episode explains the browser mechanics behind it.

#WebDevelopment #PasswordManager #UX #Autofill #HTMLForms #WebSecurity #Frontend #UserExperience #LoginForms #BrowserAPI #WebAuthn #WebDev #Technology #Coding #JavaScript #FexingoBusiness #BusinessPodcast #WebDevPodcast

Keep every episode free: buymeacoffee.com/fexingo

Episode 88 of The Web Development Podcast dives into the overlooked CSS media feature `prefers-contrast`. Lucas and Luna explain how thousands of web apps fail users who need high or low contrast, using real-world examples like GitHub's custom themes and GOV.UK's forced-colors fallback. They walk through the spec, the difference from forced-colors, practical implementation tips, and common pitfalls like overriding with `!important`. If you've ever had a user complain about text readability or eye strain, this episode shows you the one line of CSS you're probably missing.

#WebDev #Accessibility #CSS #PrefersContrast #HighContrast #LowContrast #WCAG #UserPreferences #ResponsiveDesign #HTML #LucasAndLuna #Fexingo #WebDevelopmentPodcast #ModernWeb #Frontend #CSSMediaQueries #FexingoBusiness #BusinessPodcast

Keep every episode free: buymeacoffee.com/fexingo

Episode 87 of The Web Development Podcast with Fexingo dives into the growing world of foldable and dual-screen devices. Lucas and Luna explore why most web apps break on foldable screens—from viewport resizing gotchas to CSS media queries that assume a single static screen. They walk through real-world examples like mismatched device-pixel ratios and window resizing during fold events, and share practical tips using responsive design patterns like container queries and viewport segments. By the end, you'll know how to test and optimize for Samsung Galaxy Z Fold, Huawei Mate X, and Microsoft Surface Duo. Plus, a brief word on listener support keeps the show ad-free.

#FoldableDevices #ResponsiveWebDesign #CSS #ContainerQueries #ViewportSegments #SamsungGalaxyZFold #HuaweiMateX #MicrosoftSurfaceDuo #MobileWeb #WebPerformance #DevicePixelRatio #MediaQueries #DualScreen #WebDev #Frontend #Technology #FexingoBusiness #BusinessPodcast

Keep every episode free: buymeacoffee.com/fexingo

Ever notice your web app's text is either too small or too large for users, no matter how they set their browser's default font size? In this episode, Lucas and Luna dive into the overlooked CSS 'system-ui' and rem-based sizing, revealing how most developers accidentally hardcode pixel values that ignore user preferences. They explore real-world examples from sites like Wikipedia and GitHub that get it right, and show how a simple shift from px to rem can dramatically improve accessibility. They also discuss the difference between browser zoom and text-only zoom, and why '1rem' doesn't always equal '16px' when users adjust settings. By the end, you'll know exactly how to make your web app respect the user's font size choice, boosting readability and inclusivity.

#WebDevelopment #CSS #Accessibility #Typography #UserPreferences #FontSize #RemUnits #Pixels #ResponsiveDesign #WebPerformance #UX #Frontend #HTML #BrowserSettings #InclusiveDesign #CodingTips #FexingoBusiness #BusinessPodcast

Keep every episode free: buymeacoffee.com/fexingo