css - izquierda - ¿Cómo alinear los botones de radio horizontalmente en material angular?

como centrar un boton en html con css

Question

Esperaba una directiva integrada o una etiqueta para esto, pero probablemente no de acuerdo con su documentación.

Este es el example .

<div class="radioButtondemoBasicUsage" ng-app="MyApp">
<form ng-submit="submit()" ng-controller="AppCtrl">
<p>Selected Value: <span class="radioValue">{{ data.group1 }}</span> </p>

<md-radio-group ng-model="data.group1">

  <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>

Answer 1

Mejor no anular ninguna clase existente.

Utilice la directiva ng-style y dé valor para el parámetro de visualización.

<md-radio-group ng-model="selvalue">
  <md-radio-button value="A" class="md-primary" ng-style="{''display'':''inline''}"> Apple</md-radio-button>
  <md-radio-button value="R" class="md-primary" ng-style="{''display'':''inline''}"> Orange </md-radio-button>
</md-radio-group>

Answer 2

No es necesario anular ningún CSS predeterminado:

<md-radio-group layout="row">
  <md-radio-button value=0 class="md-primary">On</md-radio-button>
  <md-radio-button value=1> Off </md-radio-button>
</md-radio-group>

Simplemente ponga en la etiqueta md-radio-group un atributo layout="row" .