0

I've stripped the example to the minimum, and the question is: where does the space between the lower side of the square and the outer div come from? How can I get rid of it, without changing the HTML tree?

.choice-picker {
  border: 1px solid #000;
}

.choice-picker > input {
  position: absolute;
  visibility: visible;
  margin-left: -9999px;
}

.choice-picker > input + label > * {
  display: inline-block;
  margin: 0em;
}
<div class="choice-picker">
  <input type="radio" id="choice1" name="choices" checked="checked">
  <label for="choice1">
    <div style="width: 3em; height: 3em; background-color: black;"></div>
  </label>
</div>
Enlico
  • 23,259
  • 6
  • 48
  • 102

0 Answers0