防止两个元素之间的换行

问题描述

| 我在CSS中有这个html：http：//jsfiddle.net/krhxG/ 我故意将div的宽度设置为20px，以解释我的需求。 如何防止通过“提交”按钮中断换行？ 我希望两个控件都成为一个完全没有换行符的控件。我该怎么做？     

解决方法

  如何防止通过“提交”按钮中断换行？ 父项ѭ1上带有

white-space: nowrap;

参见更新的jsfiddle。     ,在容器div中，您需要一个空白属性：

<div style=\"white-space:nowrap;\">
<input type=\"text\" /><input type=\"submit\" value=\"\"/>
</div>

    ,在某些奇怪的情况下（例如，由JavaScript生成并插入的html）扩展@BalusC答案，您可能还想尝试插入零宽度的连接符：

.wrapper{
  width: 290px;   
  white-space: no-wrap;
  resize:both;
  overflow:auto; 
  border: 1px solid gray;
}

.breakable-text{
  display: inline;
  white-space: no-wrap;
}

.no-break-before {
  padding-left: 10px;
}

<div class=\"wrapper\">
<span class=\"breakable-text\">Lorem dorem tralalalala LAST_WORD</span>&#8205;<span class=\"no-break-before\">TOGETHER</span>
</div>