How would I be able to remove this negative margin?

margin-left: -4px;
https://jsfiddle.net/w7cmthgv/200/

svg {
  width: 24px;
  height: 24px;
  border-top: 1px solid #0059dd;
  border-right: 1px solid #0059dd;
  border-bottom: 1px solid #0059dd;
  vertical-align: middle;
  background-color: #000000;
  cursor: pointer;
  padding-right: 2px;
  padding-top: 3px;
  padding-bottom: 2px;
  margin-left: -4px;
  fill: #0059dd;
}

Wait a sec…thats the same negative margin I just let you know to put in to fix your problem with the space between your input and svg…

…why did you take it out to begin with? Was it causing some other issue?

Nope, someone just recommended that I remove the whitespace from the html, that’s all.

I meant why did you remove the margin to begin with, before someone suggested you take the space out.

I ask because you asked what I meant by negative margin when I suggested it…then saw this thread you posted before all that, asking how to remove a negative margin. So just curious if you understand what it is and why its affecting your layout.