[RaisedButton] Wrong ripple position with custom styles.

[NewOldMax]

Problem description

After updating to 0.17.0 I have an issue with raised buttons with custom styles. See example below

As you can see, ripple has wrong position. In previous versions all works fine.

Link to minimally-working code that reproduces the issue

http://www.webpackbin.com/NJY7WMGqz

Versions

• Material-UI: 0.17.0
• React: 15.4.2
• Browser: Chrome 56

[dhavalsoni2001]

Webpackbin link is not working. Can you please share it again?

[NewOldMax]

https://www.webpackbin.com/bins/-KeXtsrRsCDqBykNIePr
As I see, all old webpackbin links not working...

[dhavalsoni2001]

Ripple effect works with Label. You used in webpackbin
const style = {

  buttonLabel: {
    margin: '15px 0 0 0',
    display: 'block'
  },

So Ripple effect also start after 15px margin. I replace margin to padding and its working fine.

[NewOldMax]

I see... But in previous versions margins worked fine... Is there some breaking changes?

[dhavalsoni2001]

Can you specify version number?

[NewOldMax]

Oh, I see the problem.
0.16.5

0.17.0

Seems that previously, there was no focus effect on button

[oliviertassinari]

We have been porting the component on the v1-beta branch. We reimplemented it from the ground-up. While we haven't tested it, I think that the issue is most likely fixed on that branch. Hence, I'm closing it.
Still, we will accept PR fixes until v1-beta takes over the master branch.