Caroline Liu caroqliu

## bento-display-contents.md

      
        
          
            
              
              1 file
            
          
          
            
              
              0 forks
            
          
          
            
              
              0 comments
            
          
          
            
              
              0 stars
            
          
        
        
          
              
          
          
            
                caroqliu
                / bento-display-contents.md
            
            
              Last active
              January 5, 2021 17:43
            
          
        
      
        
  
      
    display: contents in Bento AMP

How do we use it?

PreactBaseElement creates a <c style="display: contents"> element in the shadow root appended to its associated custom element. Note: display: contents is not supported everywhere, and its accessibility is not up to spec. Given display: inline is an acceptable fallback for it, <c> is utilized because it is display: inline by default.
For a passthrough element, it looks like this:
amp-foo
  ├── #shadow-root 
 | └── c &gt; Foo({children: Slot})