Align Checkbox and its label

Am working on Oracle CPQ tool,

Where am using checkbox, which is created as attribute.

On UI am getting

And in browser source am getting this HTML code below _

<label class="form-label" for="chkmembershipFeePayment_t" style="width: 100px">
<span style="padding-right: 5px">Membership Fee</span>
</label>
<div class="form-element field-wrapper" id="field_wrapper_1_chkmembershipFeePayment_t" style="padding-left:100px">
<div class="boolean-wrapper field" message="">
    <div class="boolean-wrapper-inner">
        <input value="false" class=" form-input  cm-attr-value " name="chkmembershipFeePayment_t" onclick="if (this.checked) { this.value='true'; } else { this.value='false'; }" data-is-boolean="true" type="checkbox">
    </div>
    <input value="true" name="_boolean_present_chkmembershipFeePayment_t" type="hidden">
</div>
<div id="msg_1_chkmembershipFeePayment_t" class="error-hover" data-action-message="" message=""></div>

My question is , I want to display checkbox before label(Membership Fee) using CSS or JS any. (I can't use html in CPQ tool attribute).

So any way to do that?