html - 按钮宽度占父项的百分比

Question

我想让我的按钮展开 90% 的屏幕宽度。

当我运行 HTML 时，按钮仅占屏幕的大约 10%。但是，如果我将宽度设置为带像素的数字，它会很好地调整大小。

出了什么问题？

.quiz {
  /*top: 240px;*/
  position: fixed;
  z-index: -1;
}

.quiz button {
  width: 90%;
  border-radius: 8px;
  display: block;
}

<div class="quiz">
  <button>Option 1</button>
</div>

Answer 1

要设置百分比高度，其父元素必须具有明确的高度。

在您的情况下，最好的方法是将 width: 100% 添加到 .quiz