flexbox按钮的子节点未按百分比应用高度

由 发布于

我有以下代码

.flex {
  display: flex;
  width: 100%;
  height: 48px;
  background: black;
  flex-direction: row
}
.flex-item {
  height: 100%;
  background: grey
}
<button class="flex">
  <div class="flex-item">
    Click Me
  </div>
</button>

The problem is, parent node is <button> with flex-direction: row, child element does not accept height in percentage. height in percentage only works if parent node is <div>