涟漪效果BoxShadow没有显示？

Question

我使用Fian的Waves来表示涟漪效应。问题是当我将box-shadow属性包含在一个带有＆＃39; wave-circle＆＃39;的按钮中时。上课，它没有显示任何影子。

CODE

<style>
.button {
  background-color: Turquoise;
  border: none;
  border-radius: 50%;
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);

  outline: 0;
}
</style>

<button class="button waves">0</button>

<script>
Waves.attach('.waves', ['waves-circle']);
Waves.init();
</script>

现在如果我添加＆＃39; wave-float＆＃39;对于＆＃39;脚本＆＃39;，它确实出现阴影，但效果溢出了它的边界。我想要的是将效果精确地放在按钮与box-shadow属性的边界上。

Waves.attach('.waves', ['waves-circle', 'waves-float']);

知道我错过了什么？

由于

Answer 1

添加：

class="waves-effect"

.waves-effect有overflow: hidden;