發現使用者名稱被隱藏掉半個漢字很彆扭！！
那麼如何避免這種情況呢！
一般中文字體我們都設置了自動換行，也就是說每個漢字都被打散成了獨立的元素；當一行漢字的寬度超過容器寬度是就折行顯示，那麼漢字是如何折行的呢？ 我們 常會設置一個清單左浮動來橫向顯示一組資料，當我們不設置li元素寬度，而父容器有不能剛好裝下整數的li元素裡，ie下就會發生一種現象（這樣的現象我 們層遇到過2次，都是沒有給容器指定寬度造成的）， 這就是最後一個不能被完整包容的li元素裡的問題會沿著容器右邊界按一個字的寬豎向排開，在不設置正確 高度的情況下，這個現象不受overflow：hidden的影響！ 當我們給li設置寬度的情況下，最後面這個不能被完全包容的li就折到下行顯示。
這種情況就恰好說明瞭瀏覽器換行的機制，這個機制就是在不設置父層元素寬度的情況下，瀏覽器會按照最後一個不可分拆的元素的寬度進行折行，在亞洲語系中這 個最後不可分的元素就是一個獨立的字體。
寫到這裡半字之癢的謎底就解開了，那就是不要給漢字設置white-space:nowarp;和white-space:pre; 更不要在使用文字打散屬性word-break：break-all；的時候再去使用word-break：keep-all屬性。
ps：word-break：keep-all； 使文字與非亞洲語系的文字保持一致！ （英文是不會換行的哦！ ）
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
