试试white-space: nowrap;

文档:https://developer.mozilla.org/docs/Web/CSS/white-space

我不知道这背后的原因，但我把我的父容器设置为display:flex，子容器设置为display:inline-block，尽管子容器的组合宽度超过了父容器，但它们仍然保持内联。

不需要玩弄最大宽度，最大高度，空白，或其他任何东西。

希望这能帮助到别人。

如果你的div有固定宽度，它不应该展开，因为你已经固定了它的宽度。但是，现代浏览器支持最小宽度CSS属性。

你可以在旧的IE浏览器中通过使用CSS表达式或使用auto width并在容器中有一个spacer对象来模拟min-width属性。这个解决方案并不优雅，但可能会奏效:

<div id="container" style="float: left">
  <div id="spacer" style="height: 1px; width: 300px"></div>
  <button>Button 1 text</button>
  <button>Button 2 text</button>
</div>

两者的组合:左;空白:nowrap;}为我工作。

他们各自都没有达到预期的结果。

试试white-space: nowrap;

文档:https://developer.mozilla.org/docs/Web/CSS/white-space

如果你不关心div的最小宽度，并且真的不希望div在整个容器中展开，你可以将它向左浮动——浮动div默认情况下会展开以支持其内容，如下所示:

<form>
    <div style="float: left; background-color: blue">
        <input type="button" name="blah" value="lots and lots of characters"/>
        <input type="button" name="blah2" value="some characters"/>
    </div>
</form>