css - 仅使用样式表 CSS防止换行

Question

我有这个：

<div>
  Yada yada yada.<sup>[1]</sup>
</div>

如何防止“。”之间的换行符 和“[1]”？最大的问题是我不能在 HTML 文档中添加任何东西（因为它们有数百个），所以我想知道我是否可以通过在样式表中添加一些东西来解决这个问题。现在我的样式表中有：

sup { white-space: nowrap;}

但这只会防止换行符在 sup-tag 中填充内容。我想知道你是否可以用 sup::before 做点什么。我已经尝试了我能想到的一切......

标签： css

Answer 1

使其宽度等于 0，但请注意，因为您可能会遇到一些意外溢出。

sup {
  display: inline-block;
  width: 0;
}

div {
  border:1px solid;
  width:100px;
}

<div>
  Yada yada yada.<sup>[1]</sup>
</div>