Controlling how many columns a component should span
In addition to specifying how many columns a layout component should have, you may also specify how many columns a component should fill within the parent grid, using the columnSpan() method. This method accepts an integer or an array of breakpoints and column spans:
- columnSpan(2) will make the component fill up to 2 columns on all breakpoints.
- columnSpan(['md' => 2, 'xl' => 4]) will make the component fill up to 2 columns on medium devices, and up to 4 columns on extra large devices. The default breakpoint for smaller devices uses 1 column, unless you use a default array key.
- columnSpan('full') or columnSpanFull() or columnSpan(['default' => 'full']) will make the component fill the full width of the parent grid, regardless of how many columns it has.
Recent News
-
Adding actions to the section's header
-
Overview
-
Responsively setting the number of grid columns
-
Controlling how many columns a component should span
-
An example of a responsive grid layout
-
Grid component
-
Setting the starting column of a component in a grid
-
test
-
Book technical mock interviews with engineers from top companies
-
How to Start A Blog in 2024