除非需要使用CSS，否则避免换行
是否可以使用CSS来自动控制换行，以便在浏览器窗口调整大小时发生以下情况：
HTML：
<body>
<div>
<span id="s1">Lorem ipsum dolor:</span>
<span id="s2">sit amet consectetur adipiscing eli</span>
</div>
</body>
因此有三种可能的观点：
1：
Lorem ipsum dolor：坐在amet consectetur adipiscing eli
2：
Lorem ipsum dolor：
坐在amet consectetur adipiscing eli
3：
Lorem ipsum dolor：
坐在amet consectetur
adipiscing eli
s1中的单词总是相同的，但s2中的单词可能会有所不同，所以我不能仅仅根据页面的宽度来改变white-space:nowrap 。
浏览器支持不是一个大问题，一旦它在Chrome和/或Firefox中运行。
这是一个可以使用的简单JSFiddle。
简单地将s2（或者，可选地，s1和s2）作为内联块：
#s2 {
display: inline-block;
}
这允许整个s2框在与第一个s1相同的行上流动，如果有足够的空间，则按照第二个点所述进行换行，然后按照第三个点所述的内容（因为内联块的行为与您的容器块元素当调整大小和包装其内容时）。 如果您有兴趣，请在规格中详细说明。
更新小提琴
另一种方法：
display: block;
float: left;
并且不要忘记给父元素一个clearfix;
DEMO
链接地址: http://www.djcxy.com/p/88337.html