Question

我有两个必须紧挨着的元素（输入和按钮）。如果前一个文本变得太长，那么它们必须被推到下一行。但是，如果它们都适合第一行，则不应将它们推到下一行。

<div>
    tag: some words of
    <span>We must stay </span><span>together</span>
</div>

编辑：更新小提琴也显示所需的结果（虽然它使用br，哪个答案不应该）

http://jsfiddle.net/GSf67/5/

编辑：澄清父级的宽度不得超出其指定的宽度。相反，应该强制换行。

Answer 1

尝试将它们包裹在div样式display:inline-block：

中

<div class="container">
    tag: some words of
    <div style="display:inline-block">
        <span>We must stay </span><span>together</span>
    </div>
</div>

又一个小提琴：http://jsfiddle.net/HsZRB/

Answer 2

分叉你的小提琴：http://jsfiddle.net/7pB2q/

您想将以下内容添加到div选择器：

div {
  white-space: nowrap;
}

CSS：强制换行元素保持在一起

2 个答案: