HTML CSS-元素的宽度大于100％的宽度

Question

我尝试将工具提示附加到元素的列表/ div块-但是这些元素的宽度设置为100％。我想拥有它，因此工具提示与列表/句子中的最后一个单词仅相距几px。

Answer 1

仅执行html + css，您需要将每行都包装在div中，例如

.gray-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  background: red;
}

.line {
  display: inline-block;
  position: relative;
}

.tooltip {
  display: inline-block;
  position: absolute;
  background: black;
  width: 30px;
  height: 20px;
  margin-left: 10px;
}

<div class="gray-container">
  <div class="line"><input type="radio">None<div class="tooltip"></div></div>
  <div class="line"><input type="radio">Two</div>
  <div class="line"><input type="radio">Three</div>
  <div class="line"><input type="radio">Four</div>
</div>

现在出于演示目的，并且由于我不知道用于创建工具提示的方法，因为您没有发布代码，因此我正在使用带有class="tooltip"的div，但这解决了您的div是100％的问题。