Button 如何在一行中挤压按钮？

我在

中有几个按钮。当

的长度超过100%时，如何压缩按钮；我是说避开第二条线

类似于

scaleX

，但取决于所有可用按钮的宽度

示例代码：

<div class="something">
  <button>some text</button>
  <button>some other text</button>
  <button>another example</button>
</div>

一些文本
其他一些文本
另一个例子

示例：

---

我想做更密集的按钮（文本字体），以保持所有的按钮在一行；但是适合原始div宽度。

您可以通过添加

按钮{padding:0}

使渲染更加紧凑。您可以通过添加

来进行更多的调整；按钮{字间距：0}

.something,
.something button {
    white-space: nowrap;
}

但是我不明白你如何使字体大小取决于可用的宽度，这似乎是什么意思。（这很容易导致严重的易访问性问题。此外，许多浏览器不允许您将字体大小减小到低于某些浏览器相关限制。）

如果您可以接受按钮内部的换行符，即按钮文本分为两行，则您可以“强制”按钮达到可接受的宽度，使文本在按钮中环绕，而不是溢出：

button { padding: 0; max-width: 14%; float: left; }

但是，在这种情况下，最好在按钮中插入强制换行符，例如

<button>some<br>text</button>
<button>some<br>other<br>text</button>  

一些
文本
一些
其他
文本

您能提供一些代码和/或图像吗？