Earlz Earlz - 4 months ago 9
CSS Question

Making a piece of text non-breaking?

say I have a piece of text like this


Hello I am some text Hello I am some
text Hello I am some text Hello I am
some text I do not wish to be broken
on new lines



Consider the above paragraph. I want for the bolded part to not be broken across a new line if possible. As in, I want it to break if it would require a scrollbar or something, but not break if it is possible to insert a page-break before or after that piece of text so that it can fit on one line.

How is this possible? I have tried things like
page-break-inside
and such, but it doesn't seem to do anything in firefox.

Answer

Use the white-space property:

Hello I am some text Hello I am some text Hello I am some text
Hello I am some text <span class="nobr">I do not wish to be
broken on new lines</span>

with:

span.nobr { white-space: nowrap; }
Comments