Home > database >  Unable to remove completely the vertical paddings inside <div> when using Bootstrap 5
Unable to remove completely the vertical paddings inside <div> when using Bootstrap 5

Time:11-26

i am trying to remove all paddings (top bottom) for a text inside a block using Bootstrap 5.

when using html without Bootstrap, setting padding: 0px does exactly what i expect:

<div style="padding: 0px; background-color: gray;">no bootstrap</div> // works!

however, the moment i use Bootstrap, the padding is never 0, even after setting class my-0. there is always extra padding that seems to be added regardless.

<div >using bootstrap my-0</div> // doesn't work

using style to override the padding to 0 also doesn't work when the Bootstrap css is included.

<div style="padding: 0px !important;">using bootstrap my-0</div> // doesn't work

is there a solution here?

CodePudding user response:

Add the class = “p-0”. A bootstrap class that set padding to 0. For top and bottom use “py-0” and for left and right “py-0”

CodePudding user response:

<div >Wiil be Remove all Paddings and margins (no extra space inside and outside div)</div>
<div >Wiil be Remove all Paddings (no extra space inside div)</div>
  • Related