Display flex items horizontally on a specific screen size in Bootstrap

To set flex item horizontally in different screen size, use the flex-*-row class.

The varied screen sizes is set for small, medium, large and extra large screen size. Let us see how to align flex items horizontally for small screen size ?

Flex Row (Small Screen)

  
Audi
  
BMW
  
Benz

The following is an example to display flex items horizontally on different screen size ?

Example

  
    
    
    
    
    
    
  



  

    
Flex
    
Resize the browser window to check the effect.
    
Flex Row
    

      
Audi
      
BMW
      
Benz
    
    
Flex Row (Small Screen)
    

      
Audi
      
BMW
      
Benz
    
    
Flex Row (Medium Screen)
    

      
Audi
      
BMW
      
Benz
    
    
Flex Row (Large Screen)
    

      
Audi
      
BMW
      
Benz