时间戳

首页 > 解决方案 > 如何在按钮内使用相对定位？

css - 如何在按钮内使用相对定位？

问题描述

我有一个简单的JSFiddle我基本上是想将一个 div 覆盖在另一个上。我可以在传统的 div 中轻松完成此操作（请参见紫色），但是当我使用按钮尝试相同的操作时，它不起作用。

<button>
  <div class="background">&nbsp;</div>
  <div class="label">This is the label</div>
</button>

.background{
  background-color: green;
  height: 100%;
}
.label{
  position: relative;
  top: -100%;
}

如何在按钮内相对定位 div？

标签： css

解决方案

您可以position: absolute;在 child.label和position: relative;parent 上使用button。

像这样：

button {
  position: relative;
}

.label{
  position: absolute;
  top: 0;
}

推荐阅读