[SalesForce] Displaying Checkbox right side of the label

I'am very new to slds.I have used Lightning input type tag for displaying the checkbox.Now checkbox is Appearing in left side.

Present Image:

enter image description here

  <lightning:input type="checkbox"  label="Selected :"  value="{!v.displayComparison.Selected__c}" />

Requirement:

But I need to display checkbox in right side of the label:

enter image description here

Tried code:
I have tried this link: Is this possible to position label for inputCheckbox on the right hand side?

   <lightning:input type="checkbox" class="myCheckbox" label="Checkbox label" />

css:

     .THIS .myCheckbox{
       display: inline-block;
     float: left;
   }

Image:
enter image description here

Best Answer

I am also new to SLDS but I have tried below code with some extra div tag to achieve the same.

<div class="slds-grid slds-wrap">
        <div class="slds-col slds-size_1-of-13 slds-p-right_x-small">
            <p>Selected</p>
        </div>
        <div class="slds-col slds-size_1-of-12">
            <lightning:input type="checkbox" />
        </div>
    </div>

below is how this will look like:

enter image description here

Please correct me if this is not what you were trying to achieve.

Related Topic