Modules
Centered
This module helps to center an element horizontally if its maximum width is set.
Usage #
If an element has a specified width, it can be centered horizontally with the centered class.
<div class="container-4 centered bg-platinum"></div>
If the element is already centered, for example, it is specified in the properties of the custom class.
Then it can be modified with the uncentered class.
<div class="container-4 uncentered bg-platinum my-block-centered"></div>
Responsive #
To change the centering behavior on small screens, you can use centering classes with the -sm suffix.
In the example below, the element will become uncentered on small screens.
<div class="w-50 centered uncentered-sm bg-platinum"></div>
In the example below, the element will become centered on small screens.
<div class="w-50 centered-sm bg-platinum"></div>