0

I have a two which they are inline . there is space between them , how can I remove the space between two 

  <div class="d-inline pl-5" style="float:left">
       <div class="showborder d-inline" style="padding:0 !important;margin:0 !important">test1</div>
       <div class="showborderblue d-inline" style="padding:0 !important;margin:0 !important">test2</div>
  </div>

and this is CSS, to show the space between the divs I have set border

 .showborder {
   border: 2px solid red;
 }

 .showborderblue {
   border: 2px solid blue;    
 }

The result is like this:

enter image description here

I want the red line to stick to the black line. and remove the space between Test1 and test2

nnmmss
  • 2,850
  • 7
  • 39
  • 67
  • Remove the whitespaces inside your html might help, or remove the `float: left` on the parent element and set it to `display: flex`. Might be a duplicate of https://stackoverflow.com/questions/5078239/how-do-i-remove-the-space-between-inline-inline-block-elements – andreasbecker.de Mar 03 '22 at 15:31
  • 1
    change the parent to `d-inline-flex` and remove `d-inline` from children – Pete Mar 03 '22 at 15:32
  • I think you can probably change the Gutters to either `g-0` (all sides) or `gy-0` (left and right only). Here is a better explanation.... https://getbootstrap.com/docs/5.0/layout/gutters/ – Cutey from Cute Code Mar 03 '22 at 17:00

0 Answers0