Checkbox Alignment problem when checked - HTML/CSS

Question

When checkboxes are unchecked, the alignment is in a straight line.But, if the checkbox is checked,the box moves towards left. I want the boxes to be aligned in a straight line whether checked or not. Please mention fix for this issue.

 [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>

Answer 1

There is definitely an issue related to the width and height of the elements. This should fix it:

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);
}