MENU


Spacing

To set the margin or padding, use:

.{m | p | g}[-t | -b | -l | -r | -x | -y][-sm | -md | -lg | -xl | -xxl]-{ 0 | 1 | 2 | 3 | 4 | 5 | auto }

where:

m means margin (spacing outside),

p means padding (spacing inside),

g means gutter (spacing between columns),

t means top

b means bottom

l means left

r means right

x means left and right

y means top and bottom


RESETRUNFULL
<!DOCTYPE html><html>
<head><link href='https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/css/bootstrap.min.css' rel='stylesheet' integrity='sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor' crossorigin='anonymous'>
      <script src='https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/js/bootstrap.bundle.min.js' integrity='sha384-pprn3073KE6tl6bjs2QrFaJGz5/SUsLqktiwsUTF55Jfv3qYSDhgCecCxMW52nD2' crossorigin='anonymous'></script>
      <style>div:not(.container):not(.tooltip):not(.tooltip *):not(.navbar *):not(.carousel-caption):not(.card *):not(.form-check):not(.input-group) { border:1px solid grey; text-align:center; }</style>
</head><body>

<div class="pt-2 bg-secondary">
   <img src="frog.jpg" class="ml-5 pt-3"/>
</div>

</body><html>

.mx-auto horizontally centers a fixed-width block element.