EU System

Flex

Documentation • Demo

Flexbox

Quickly manage the layout, alignment, and sizing of grid columns, navigation, components, and more with a full suite of responsive flexbox utilities.

For more information, please read Bootstrap 4 documentation.

We use the same classes, prefixed by .ecl-u-.

 
/* No context defined for this component. */
 

        
    



    
    




    


        

            
            
        


        
        

            
    
                
  • 
                    Content:
                    
                        
    
                            
                            
                                
    /**
 * Flex utilities
 */

// Import base and generic
@import '@ecl/eu-base/eu-base';
@import '@ecl/generic-utility-flex/generic-utility-flex';

// Use generic mixin
@include exports('eu-utility-flex') {
  @include ecl-utility-flex();
}

    
                                
                            
                        
    
                        
                
    • 
                
  • 
                    URL:
                    /components/raw/eu-utility-flex/eu-utility-flex.scss
                
    • 
                
  • 
                    Filesystem Path:
                    ../../src/systems/eu/eu-utility/eu-utility-flex/eu-utility-flex.scss
                
    • 
                
  • 
                    Size:
                    237 Bytes
                
    • 
            

        

        
    






    
    

    
    
        
  • 
            Handle:
            @ecl/eu-utility-flex
        
    • 
        
        
        
        
        
        
  • 
            Preview:
            
                
            
        
    • 
        
  • 
            Filesystem Path:
            ../../src/systems/eu/eu-utility/eu-utility-flex/eu-utility-flex.twig
        
    •