วิธีป้องกันการแบ่งบรรทัดในรายการโดยใช้ CSS

ฉันกำลังพยายามใส่ลิงค์ชื่อส่งประวัติย่อในเมนูโดยใช้liแท็ก เนื่องจากช่องว่างระหว่างคำสองคำนั้นล้อมรอบสองบรรทัด วิธีการป้องกันการห่อนี้ด้วย CSS?

ใช้white-space: nowrap;^{[1] [2]}หรือให้ลิงก์นั้นมีพื้นที่มากขึ้นโดยตั้งค่าliความกว้างเป็นค่าที่มากขึ้น

^[1] § 3. White Space and Wrapping: คุณสมบัติ white-space - W3 CSS Text Module Level 3
^[2] white-space - CSS: Cascading Style Sheets | MDN

คุณสามารถเพิ่มส่วนย่อยของรหัสนี้เพื่อเพิ่ม "... " ที่ดีในตอนท้ายของบรรทัดหากเนื้อหามีขนาดใหญ่พอที่จะใส่ในบรรทัดเดียว:

li {
  overflow: hidden; 
  text-overflow: ellipsis;
  white-space: nowrap;
}

หากคุณต้องการได้รับการคัดเลือกอย่างเหมาะสม (เช่น: ไปยังลิงก์เฉพาะนั้น) คุณสามารถใช้พื้นที่ที่ไม่แตกได้แทนที่จะเป็นพื้นที่ปกติ:

<li>submit&nbsp;resume</li>

https://en.wikipedia.org/wiki/Non-breaking_space#Encodings

แก้ไข: ฉันเข้าใจว่านี่คือ HTML ไม่ใช่ CSS ตามที่ร้องขอโดย OP แต่บางคนอาจพบว่ามีประโยชน์ ...

จอแสดงผล: บล็อกแบบอินไลน์; จะป้องกันการแตกระหว่างคำในรายการ

 li {
    display: inline-block;
 }

Bootstrap 4 text-nowrapมีระดับที่ชื่อว่า มันเป็นสิ่งที่คุณต้องการ