How to prevent line breaks in list items using CSS

html css word-wrap
Rajasekar picture Rajasekar · Sep 5, 2009 · Viewed 390.7k times · Source

I'm trying to put a link called Submit resume in a menu using a li tag. Because of the whitespace between the two words it wraps to two lines. How to prevent this wrapping with CSS?

Answer

n1313 picture n1313 · Sep 5, 2009

Use white-space: nowrap;[1] [2] or give that link more space by setting li's width to greater values.

[1] § 3. White Space and Wrapping: the white-space property - W3 CSS Text Module Level 3
[2] white-space - CSS: Cascading Style Sheets | MDN

Related questions

How to word wrap text in HTML?

How can text like aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa which exceeds the width of a div (say 200px) be wrapped? I am open to any kind of solution such as CSS, jQuery, etc.

Read More
Wrap text in <td> tag

I want to wrap some text that is added to a <td> element. I have tried with style="word-wrap: break-word;" width="15%". But it is not wrapping the text. Is it mandatory to give it 100% width? I have other …

Read More
How to make a DIV not wrap?

I need to create a container DIV style that contains multiple other DIV's. It is asked that these DIV's wouldn't wrap if the browser window is resized to be narrow. I tried to make it work like below. <style&…

Read More