jquery mobile checkbox styling issue

Using jquery mobile.

Try to make the disabled checkbox visible. height/width can be overridden.

<div class=" ui-checkbox ui-state-disabled">
 <input type="checkbox" name="foo" checked="checked" disabled="disabled">
</div>

Why the position is !important, and it can not be overridden. As a result, it can not align well with neighboring elements in different situations.

.ui-checkbox input:disabled, .ui-radio input:disabled {
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px,1px,1px,1px);
}

Thanks for advice.