semantic ui react, how to change label position?

Question

Is it possible to change label position from right side to the left? I've tried to use float: left but it doesn't work.

import {Radio } from "semantic-ui-react"
<Radio label="in progress" toggle />

Answer 1

Can be done, have to do it a bit hacky way. Here is how it can be done.

const RadioExampleRadio = () => (
  <div class="radio-block">
    {" "}
    <label className="radio-label">Radio Label</label>
    <Radio />
  </div>
);

Have to add some css to make it look better

.radio-block{
  display: flex;
  align-items: center;
}
.radio-label{
  margin-right: 10px;
}

From semantic's documentation, there doesn't seem to be any comment on changing the position of the label on the radio button. It can be done this way though.