Jump to main content

Nicolas Hoizey

  • articles
  • billets
  • links
  • notes
  • talks
  • archives
  • about

Trys Mudford avatar Trys Mudford

Fading out siblings on hover in CSS

  • Nicolas Hoizey
  • 18 April 2019
  • CSS
  • 1 reaction
Screenshot of “Fading out siblings on hover in CSS”

https://www.trysmudford.com/blog/fade-out-siblings-css-trick/

Trys here shows a nice little CSS trick to make hovered elements pop out (quite easy), while diming the siblings (that's the trick). Well done!

1 reaction

1 repost

  1. PhoenixCodes avatar
  • Older: Why Should I Care What Color the Bikeshed Is?
  • Newer: Progressive Font Enrichment: reinventing web font performance

Related contents with similar topics

  1. screenshot of Controlling when CSS custom property values are computed

    Jake Archibald avatar Jake Archibald

    Controlling when CSS custom property values are computed

    • Nicolas Hoizey
    • 15 September 2026
    • CSS
    • 2 reactions

    When and how CSS custom property values are calculated might not be what you expect, and it has a big impact on your styles.

  2. screenshot of Scroll-Driven Animations

    Josh W. Comeau avatar Josh W. Comeau

    Scroll-Driven Animations

    • Nicolas Hoizey
    • 30 April 2026
    • CSS, animations
    • 4 reactions

    The CSSWG deserves a lot of credit, in my opinion, for repurposing/extending CSS keyframe animations for scroll-driven animations. Rather than invent…

  3. screenshot of Overview of CSS-only scrolling shadows and content fading techniques

    Francesco Schwarz avatar Francesco Schwarz

    Overview of CSS-only scrolling shadows and content fading techniques

    • Nicolas Hoizey
    • 11 February 2026
    • CSS
    • 5 reactions

    When content overflows and the scrollbar is insufficient or intentionally hidden, visual cues such as scroll shadows or fading effects signal that…

  4. screenshot of Try text scaling support in Chrome Canary

    Josh Tumath avatar Josh Tumath

    Try text scaling support in Chrome Canary

    • Nicolas Hoizey
    • 28 January 2026
    • accessibility, em, rem, CSS
    • 1 reaction

    Just like how the tag tells the browser that your website is designed to work for small viewport sizes, the tells the browser, 'Hey, I've designed…

  5. screenshot of A new (or rather, old) approach to typography on the web

    Alvin Leung, Taha Hossain, Shen Gao, Ben Giannis and Rafi Rizky

    A new (or rather, old) approach to typography on the web

    • Nicolas Hoizey
    • 3 December 2025
    • Web, typography, CSS, Design System

    The strongest type systems are opinionated. They respond thoughtfully to the environment they inhabit, carrying a voice that cannot be captured by…

If you want to share an error or suggest an enhancement of this content, please edit the source on GitHub.

© Nicolas Hoizey

Built with Eleventy