What does the `p-N` and its variants represent in Bootstrap v4?

They are the new spacing utility classes. I think they’re very intuitive:

  • p-* is for padding all sides.
  • m-* is for margin all sides.
  • pl-* is for padding left.
  • mt-* is for margin top.
  • mr-auto is for margin right auto.

Spacing Utils Demo

There are also display utilties.

d-block, d-flex, d-inline-block, d-none etc…

Leave a Comment