Grid Behavior
A grid can function in three different ways across different breakpoints(In responsive design, a breakpoint is the “point” at which a website’s content and design will adapt in a certain way in order to provide the best possible user experience.)
Fixed Grids
A fixed grid has fixed-width columns and flexible margins. The fixed grid has a fixed content width that doesn’t change in a specific breakpoint range, and the flexible margins occupy the remaining space.
Fluid or Full-Width Grids
A fluid grid has fluid-width columns, fixed gutters, and fixed side margins. The fluid grid has a flexible content width that goes edge to edge as per the screen size. In a fluid grid, columns either grow or shrink to adapt to the available space.
Hybrid Grids
A hybrid grid has both fluid-width and fixed-width components.
In modern layouts, a few elements completely bleed off the grid and align edge to edge on the screen. Headers, footers, full-bleed visible containers, or images are a few of the common examples. If the content width is more than the available screen size, a fixed grid dramatically turns into a fluid grid adapting to the entire available space on the screen to adequately fit the content.
Source Credit: https://medium.muz.li/responsive-grid-design-ultimate-guide-7aa41ca7892