row no-gutters

container-fluid

  

    

      
1 of 2
      
2 of 2
    
    

      
1 of 3
      
2 of 3
      
3 of 3
    
  

  

    

      ////
    
  


  

    

////
    
  




  // Extra small devices (portrait phones, less than 576px)
  @media (max-width: 575.98px) { ... }

  // Small devices (landscape phones, 576px and up)
  @media (min-width: 576px) and (max-width: 767.98px) { ... }

  // Medium devices (tablets, 768px and up)
  @media (min-width: 768px) and (max-width: 991.98px) { ... }

  // Large devices (desktops, 992px and up)
  @media (min-width: 992px) and (max-width: 1199.98px) { ... }

  // Extra large devices (large desktops, 1200px and up)
  @media (min-width: 1200px) { ... }

  @include media-breakpoint-up(xs) { ... }
  @include media-breakpoint-up(sm) { ... }
  @include media-breakpoint-up(md) { ... }
  @include media-breakpoint-up(lg) { ... }
  @include media-breakpoint-up(xl) { ... }

  $zindex-sticky: 1020 !default;
  $zindex-fixed: 1030 !default;
  $zindex-modal-backdrop: 1040 !default;
  $zindex-modal: 1050 !default;
  $zindex-popover: 1060 !default;
  $zindex-tooltip: 1070 !default;

w-100 / column break

  
    

      

        

          .col-6 .col-sm-4
        
        

          .col-6 .col-sm-4
        

        
        


        

          .col-6 .col-sm-4
        
        

          .col-6 .col-sm-4
        
      
    

  
  

row / justify-content-start, justify-content-center, justify-content-end,justify-content-around,justify-content-between

  

    

      

        1 of 3
      
      

        Variable width content
      
      

        3 of 3
      
    
    

      

        1 of 3
      
      

        Variable width content
      
      

        3 of 3
      
    
  

row row-cols-

  

    

      
Column
      
Column
      
Column
      
Column
    
  

row / align-items-start, align-items-center, align-items-end

  

     

       One of three columns
     
     

       One of three columns
     
     

       One of three columns
     
   

Order classes

  

    

      

        First, but unordered
      
      

        Second, but last
      
      

        Third, but second
      
    
  

col- / offset-

  

    

      
.col-md-4
      
.col-md-4 .offset-md-4
    
    

      
.col-md-3 .offset-md-3
      
.col-md-3 .offset-md-3
    
    

      
.col-md-6 .offset-md-3
    
  

col- / margin

  

    

      
.col-md-4
      
.col-md-4 .ml-auto
    
    

      
.col-md-3 .ml-md-auto
      
.col-md-3 .ml-md-auto
    
    

      
.col-auto .mr-auto
      
.col-auto