不知平時(shí)工作中，大家有沒有遇到跟筆者相似的情況：設(shè)計(jì)圖紙上某句話必須是一行顯示的，實(shí)際實(shí)現(xiàn)卻偏偏因一個(gè)字而換行。比如：某設(shè)計(jì)圖紙是這樣的：
capture1.png
咋一看似乎沒什么難度嘛，很普通的布局而已，很容易讓人想到給盒子上下左右padding基本就完事兒了。不知大家注意到圖中的小藍(lán)線沒有，也就是說，如果給盒子右的padding一個(gè)固定值，那么必然會(huì)導(dǎo)致第五行文字（最后一行）的“有”（最后一字）會(huì)換行。
即真實(shí)實(shí)現(xiàn)的樣子：
capture2.png
真是理想與現(xiàn)實(shí)的差距呀。那么怎樣還原設(shè)計(jì)圖呢？一開始筆者想到的是很硬核的實(shí)現(xiàn)：absolute。但。。。真的很硬核，真想直接告訴設(shè)計(jì)師實(shí)現(xiàn)不了。然而問題的解決方案往往比想象中的容易，那就是使用我們今天的主角：white-space
/*僅作用于第五行文字*/
white-space: nowrap;
竟然一句話就搞定了呢，所以有時(shí)遇到問題還真應(yīng)該冷靜去思考分析呢，今此做下記錄，幫助遇到類似問題的小伙伴。
