Hello Dear Readers, Today In this Post, You will learn Bootstrap 5 Tutorial In Hindi | Bootstrap 5 Horizontal Alignment Class. Earlier I have shared a Responsive E-Commerce Website Using Bootstrap 5 | (Part-3). and now it’s time to Bootstrap 5 Tutorial In Hindi | Bootstrap 5 Horizontal Alignment Class.
In this tutorial, You will learn full Bootstrap 5. I will give all the part here and if you want to go deep in the tutorial so you can watch the full video which is I like below Hope it will help you all thank for visiting.
In this tutorial, you will learn Bootstrap Tutorial In Hindi, Bootstrap 5 Horizontal Alignment Class. Bootstrap 5 Tutorial In Hindi You can learn what is bootstrap framework, what are the advantages of bootstrap tutorial in Hindi. Make sure to Subscribe, Share the video, and Like it, for more tutorials in Hindi like this one!
Horizontal alignment
Bootstrap 5 Horizontal alignment
Utilities for horizontal alignment.
Center text
To center text add .text-center
class to the parent element
Center image
You can also center the image by adding the .text-center
class to the image’s parent element.
Center button
The same as above, add the .text-center
to the parent element of the button to center it.
Center column
By using flexbox you can center the entire the column of the grid.
Flexbox options
Use justify-content
utilities on flexbox containers to change the alignment of flex items on the main axis (the x-axis to start, y-axis if flex-direction: column
). Choose from start
(browser default), end
, center
, between
, around
, or evenly
.
Responsive variations also exist for justify-content
.
.justify-content-start
.justify-content-end
.justify-content-center
.justify-content-between
.justify-content-around
.justify-content-evenly
.justify-content-sm-start
.justify-content-sm-end
.justify-content-sm-center
.justify-content-sm-between
.justify-content-sm-around
.justify-content-sm-evenly
.justify-content-md-start
.justify-content-md-end
.justify-content-md-center
.justify-content-md-between
.justify-content-md-around
.justify-content-md-evenly
.justify-content-lg-start
.justify-content-lg-end
.justify-content-lg-center
.justify-content-lg-between
.justify-content-lg-around
.justify-content-lg-evenly
.justify-content-xl-start
.justify-content-xl-end
.justify-content-xl-center
.justify-content-xl-between
.justify-content-xl-around
.justify-content-xl-evenly
.justify-content-xxl-start
.justify-content-xxl-end
.justify-content-xxl-center
.justify-content-xxl-between
.justify-content-xxl-around
.justify-content-xxl-evenly