Bootstrap 4 classes

How to align offset space in the left side ?

offset-md-1 

This below example moves the div from left and same way it moves from the right as well for this row. So we can use this way whereever we need col-md-1o instead of col-md-12. (better use case would be 5 equivalent div in the bootstrap row)

<div class="row">
			<div class="offset-md-1 col-md-8">				
			</div>
			<div class="col-md-1 m-2">			
			</div>
			<div class="col-md-1 offset-md-right-1 m-2">				
			</div>
</div>

How to align offset space to the right side of the div / row ?

offset-md-right-1

<div class="row">
			<div class="offset-md-1 col-md-8">				
			</div>
			<div class="col-md-1 m-2">			
			</div>
			<div class="col-md-1 offset-md-right-1 m-2">				
			</div>
</div>

How to align margin spaces in bootstrap 4 ?

These classes can be used to give margin spaces for any html elements. We can give from m-1 to m-5 only. (freshers: don’t try to give m-6, m-7 etc as it works only till m-5 only)

This gives the space in all the directions like top, right, bottom and left.

m-1 
m-2
m-3
m-4
m-5

How to align margin top spaces in bootstrap 4 elements ?

mt-* classes can be used to give margin top spaces for html elements in bootstrap 4. This bootstrap 4 classes can be effectively used to give only margin top spaces.

mt-1
mt-2
mt-3
mt-4
mt-5

How to align margin right spaces in bootstrap 4 elements ?

mr-* classes can be used to give margin right spaces for html elements in bootstrap 4. This bootstrap 4 classes can be effectively used to give only margin right spaces.

mr-1
mr-2
mr-3
mr-4
mr-5

How to align margin bottom spaces in bootstrap 4 elements ?

mb-* classes can be used to give margin bottom spaces for html elements in bootstrap 4. This bootstrap 4 classes can be effectively used to give only margin bottom spaces.

mb-1
mb-2
mb-3
mb-4
mb-5

How to align margin left spaces in bootstrap 4 elements ?

ml-* classes can be used to give margin left spaces for html elements in bootstrap 4. This bootstrap 4 classes can be effectively used to give only margin left spaces.

ml-1
ml-2
ml-3
ml-4
ml-5

How to align padding spaces in bootstrap 4 ?

These classes can be used to give padding spaces for any html elements. We can give from p-1 to p-5 only. (freshers: don’t try to give p-6, p-7 etc as it works only till p-5 only)

p-1
p-2
p-3
p-4
p-5

How to align padding top spaces in bootstrap 4 elements ?

pt-* classes can be used to give padding top spaces for html elements in bootstrap 4. This bootstrap 4 classes can be effectively used to give only padding top spaces.

pt-1
pt-2
pt-3
pt-4
pt-5

How to align padding right spaces in bootstrap 4 elements ?

pr-* classes can be used to give padding right spaces for html elements in bootstrap 4. This bootstrap 4 classes can be effectively used to give only padding right spaces.

pr-1
pr-2
pr-3
pr-4
pr-5

How to align padding bottom spaces in bootstrap 4 elements ?

pb-* classes can be used to give padding bottom spaces for html elements in bootstrap 4. This bootstrap 4 classes can be effectively used to give only padding bottom spaces.

pb-1
pb-2
pb-3
pb-4
pb-5

How to align padding left spaces in bootstrap 4 elements ?

pl-* classes can be used to give padding left spaces for html elements in bootstrap 4. This bootstrap 4 classes can be effectively used to give only padding left spaces.

pl-1
pl-2
pl-3
pl-4
pl-5