选中时的复选框对齐问题-HTML / CSS

如何解决选中时的复选框对齐问题-HTML / CSS

未选中复选框时，对齐方式为一条直线。但是，如果选中此复选框，则该框向左移动。 无论是否选中，我都希望框对齐直线。 请提及解决此问题的方法。

[Image- CheckBox moves when checked][1] input[type=checkBox][_ngcontent-c13],.tbl-chkBx[_ngcontent-c13] {
  height: auto;
  width: auto;
  margin-top: auto;
  vertical-align: initial;
  text-align: center;
}

<td _ngcontent-c13="" class="tbl-chkBx">

  <input _ngcontent-c13="" class="form-check-input position-static ng-untouched ng-valid" formcontrolname="isSelected" type="checkBox" ng-reflect-name="isSelected">

</td>

解决方法

肯定存在与元素的宽度和高度有关的问题。 这应该解决它：

input[type="checkbox"] { 
  margin-right: 5px;
  display: inline-block; 
  border: 1px solid black; 
  -webkit-transform: scale(1.4);
  -moz-transform: scale(1.4);
  -ms-transform: scale(1.4);
  -o-transform: scale(1.4);
  transform: scale(1.4);
}