Lablel for md-radio-group
From https://codepen.io/jakobadam/pen/xqZoBR
<!--
`md-input-has-value` elevates `label`
`md-input-invalid` shows error message
-->
<md-input-container class="md-input-has-value"
ng-class="{ 'md-input-invalid' : form.fruit.$invalid && form.$submitted }">
<label class="md-required" translate>Fruit</label>
<md-radio-group md-autofocus name="fruit" ng-model="fruit" layout="row" required>
<md-radio-button value="Apple" class="md-primary">Apple</md-radio-button>
<md-radio-button value="Banana"> Banana </md-radio-button>
<md-radio-button value="Mango">Mango</md-radio-button>
</md-radio-group>
<div ng-messages="form.fruit.$error">
<div ng-message="required" translate>Yo. Select some fruit.</div>
</div>
</md-input-container>
This is what you are looking for.
<div fxLayout fxLayoutAlign="center center" fxLayoutGap="30px">
<label>Sort by</label>
<md-radio-group>
<md-radio-button value="1">Date</md-radio-button>
<md-radio-button value="2">Status</md-radio-button>
<md-radio-button value="3">From</md-radio-button>
<md-radio-button value="4">To</md-radio-button>
</md-radio-group>
</div>
css
.mat-radio-button {margin-right: 30px;}
else add flexLayout to your md-radio-group
<md-radio-group fxLayout fxLayoutAlign="center center" fxLayoutGap="30px">