Radio-button label doesn't wrap by default, unlike check-box label. Couldn't make it wrap with CSS either.

[srix55]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

The label should wrap for longer labels

What is the current behavior?

Doesn't wrap. Overflows container.

What are the steps to reproduce?

http://plnkr.co/edit/PS09vZVKMQxIMLd72mSS?p=preview

What is the use-case or motivation for changing an existing behavior?

Radio button labels overflow their card containers and are displayed with an ugly horizontal scrollbar when viewed on a mobile device

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

@angular/compiler: 4.3.1
@angular/material: 2.0.0-beta.8-374aaff

Is there anything else we should know?

I tried the solutions related to issue #2019 . Couldn't make it work.

[julianobrasil]

You can make your style global and apply it to your radio:

<md-radio-button class="myClass"></md-radio-button>

Where myClass is defined globally:

.myClass > label {
    white-space: normal;
}

plunk: http://plnkr.co/edit/s105l0VXQDv9byVyHLAE?p=preview

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}