[css] What is class="mb-0" in Bootstrap 4?

The latest documention has:

<p class="mb-0">Lorem ipsum</p>

Q: What is mb-0?

m - sets margin

p - sets padding

t - sets margin-top or padding-top

b - sets margin-bottom or padding-bottom

l - sets margin-left or padding-left

r - sets margin-right or padding-right

x - sets both padding-left and padding-right or margin-left and margin-right

y - sets both padding-top and padding-bottom or margin-top and margin-bottom

blank - sets a margin or padding on all 4 sides of the element

0 - sets margin or padding to 0

1 - sets margin or padding to .25rem (4px if font-size is 16px)

2 - sets margin or padding to .5rem (8px if font-size is 16px)

3 - sets margin or padding to 1rem (16px if font-size is 16px)

4 - sets margin or padding to 1.5rem (24px if font-size is 16px)

5 - sets margin or padding to 3rem (48px if font-size is 16px)

auto - sets margin to auto

Bootstrap has predefined classes that we use for styling. If you are familiar with CSS, you'd know what padding, margin and spacing etc. are.

mb-0 = margin-bottom:0;

OK now moving a little further in knowledge, bootstrap has more classes for margin including:

mt- = margin-top
mb- = margin-bottom
ml- = margin-left
mr- = margin-right
my- = it sets margin-left and margin-right at the same time on y axes
mX- = it sets margin-bottom and margin-top at the same time on X axes

This and much more is explained here https://getbootstrap.com/docs/5.0/utilities/spacing/ The best way to learn is through https://getbootstrap.com site itself. It explains a lot obout its built in classes.

Bootstrap 4

It is used to create a bottom margin of 0 (margin-bottom:0). You can see more of the new spacing utility classes here: https://getbootstrap.com/docs/4.0/utilities/spacing/

Related: How do I use the Spacing Utility Classes on Bootstrap 4

m - for classes that set margin, like this :

• mt - for classes that set margin-top
• mb - for classes that set margin-bottom
• ml - for classes that set margin-left
• mr - for classes that set margin-right
• mx - for classes that set both margin-left and margin-right
• my - for classes that set both margin-top and margin-bottom

Where size is one of margin :

• 0 - for classes that eliminate the margin by setting it to 0, like mt-0
• 1 - (by default) for classes that set the margin to $spacer * .25, like mt-1
• 2 - (by default) for classes that set the margin to $spacer * .5, like mt-2
• 3 - (by default) for classes that set the margin to $spacer, like mt-3
• 4 - (by default) for classes that set the margin to $spacer * 1.5, like mt-4
• 5 - (by default) for classes that set the margin to $spacer * 3, like mt-5
• auto - for classes that set the margin to auto, like mx-auto

class="mb-0"

m - sets margin

b - sets bottom margin or padding

0 - sets 0 margin or padding

CSS class

.mb-0{
       margin-bottom: 0
     }