Example of the Bootstrap 4.1.0 grid system (container-fluid)
Just change the size of the browser window and the change of the grid will get obvious.
Current Class (Visibility):
xs (extra small) d-inline d-sm-none
sm (small) d-none d-sm-inline d-md-none
md (medium) d-none d-md-inline d-lg-none
lg (large) d-none d-lg-inline d-xl-none
xl (xlarge) d-none d-xl-inline
sm+ (small) d-none d-sm-inline
md+ (medium) d-none d-md-inline
lg+ (large) d-none d-lg-inline
xl+ (xlarge) d-none d-xl-inline
First we use
col-6
col-sm-4
col-md-3
col-lg-1
for each cell.';
echo '
';
for ($i=1; $i <= 36;$i++) {
echo '
' . $i . ': Just some text.
';
}
echo '
';
echo '
Here we use col-12
col-sm-6
col-md-4
col-lg-1
for each cell.
';
echo '
';
for ($i=1; $i <= 36;$i++) {
echo '
' . $i . ': Just some text.
';
}
echo '
';
?>
Example of the Bootstrap 4.1.0 grid system (container)
Just change the size of the browser window and the change of the grid will get obvious.
First we use
col-6
col-sm-4
col-md-3
col-lg-1
for each cell.';
echo '
';
for ($i=1; $i <= 36;$i++) {
echo '
' . $i . ': Just some text.
';
}
echo '
';
echo '
Here we use col-12
col-sm-6
col-md-4
col-lg-1
for each cell.
';
echo '
';
for ($i=1; $i <= 36;$i++) {
echo '
' . $i . ': Just some text.
';
}
echo '
';
?>