设计师要求文字必须排满一行？

不知平时工作中，大家有没有遇到跟笔者相似的情况：设计图纸上某句话必须是一行显示的，实际实现却偏偏因一个字而换行。比如：某设计图纸是这样的：

capture1.png

咋一看似乎没什么难度嘛，很普通的布局而已，很容易让人想到给盒子上下左右padding基本就完事儿了。不知大家注意到图中的小蓝线没有，也就是说，如果给盒子右的padding一个固定值，那么必然会导致第五行文字（最后一行）的“有”（最后一字）会换行。
即真实实现的样子：

capture2.png

真是理想与现实的差距呀。那么怎样还原设计图呢？一开始笔者想到的是很硬核的实现：absolute。但。。。真的很硬核，真想直接告诉设计师实现不了。然而问题的解决方案往往比想象中的容易，那就是使用我们今天的主角：white-space

/*仅作用于第五行文字*/
white-space: nowrap;

竟然一句话就搞定了呢，所以有时遇到问题还真应该冷静去思考分析呢，今此做下记录，帮助遇到类似问题的小伙伴。