JSFiddle - React, Tailwind, and code Playground

by Omar X

HTML

<script src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css">
<legend>Gender</legend>
<div class="ui-grid-a">
    <div class="ui-block-a">
        <input type="radio" id="Male" name="radio-group-1" value="Male" data-iconpos="right" />
        <label for="Male" data-inline="true" style="background:transparent !important;">Male</label>
    </div>
    <div class="ui-block-b">
        <input type="radio" id="Female" name="radio-group-1" value="Female" data-iconpos="right" />
        <label for="Female" data-inline="true" style="background:transparent !important;">Female</label>
    </div>
</div>

CSS

.ui-radio {
    float:right;
    text-align:right;
}
input[type="radio"] {
    display: none;
}