CODEWITHSUNDEEP
htmlcssnowrap
Earlz
Earlz

Reputation: 63845

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.

Upvotes: 77

Views: 83461

Answers (3)

Yevgeniy Afanasyev
Yevgeniy Afanasyev

Reputation: 41360

bootstrap 4 has a class="text-nowrap"

more here https://getbootstrap.com/docs/4.0/utilities/text/#text-wrapping-and-overflow

Upvotes: 7

BananaAcid
BananaAcid

Reputation: 3481

Adding this for completeness:

If you do not want to use CSS, you could use <nobr>text with space</nobr> - reference here

For pure text blocks, i believe not-anymore-depricated html formatting tags like <i>, <b>, <nobr> and alike are valid for use. For content relating to the site structure use <em>, <strong> and <span class="">.

Upvotes: 12

cletus
cletus

Reputation: 625097

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; }

Upvotes: 142

Related Questions