content-visibility

The content-visibility property controls whether or not an element renders its contents at all, along with forcing a strong set of containments, allowing user agents to potentially omit large swathes of layout and rendering work until it becomes needed. 4. Suppressing An Element’s Contents Entirely: the content-visibility property

Links about content-visibility

1. Content-visibility and Accessible Semantics | MarcySutton.com

   While working with the team at DEV this past quarter on their open source community platform, Forem, they requested I review a Pull Request…

   

2. More on content-visibility | CSS-Tricks

   posted on October 28, 2020

   Back in August 2020, when the content-visiblity property in CSS trickled its way into Chrome browsers, Una Kravets and Vladimir Levin wrote about it and

   

3. content-visibility: the new CSS property that boosts your rendering performance

   posted on August 5, 2020

   The CSS content-visibility property enables web content rendering performance benefits by skipping rendering of off-screen content. This article shows you how to leverage this new CSS property for faster initial load times, using the auto keyword. You will also learn about the CSS Containment Spec a…

   

4. Short note on content-visibility: hidden – HTML Accessibility

   posted on August 26, 2020 by Steve Faulkner

   What I am interested in is how it is exposed to screen readers and other assistive technology that make use of the content information represented in the browser accessibility tree.

   

Code sample

section {
  content-visibility: hidden;
}