MENU


Borders

To add a border, use:

   .border[-top | -right | -bottom | -left]

To remove a border, use:

   .border[-top | -right | -bottom | -left]-0

To change the border width, add:

   .border-{1 | 2 | 3 | 4 | 5}

To round the corners of an element, use:

   .rounded[-top | -right | -bottom | -left | -circle | -pill | -0 | -sm | -lg]


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="w-50 h-50 my-3 mx-auto rounded-pill border-5 border-dark text-center">
      my<br/>box
   </div>
   <div class="w-50 h-50 my-3 mx-auto border-right-0 border-primary text-center">
      my<br/>box 2
   </div>

</body><html>