CODEWITHSUNDEEP
htmlcss
user3506166
user3506166

Reputation: 43

One letter word on the end of line (justify)

I wonder what I can do if I have one letter word on the end of text line, for example:

"Hello my name is John Smith, and I
am a freshman!"

How can I move "I" to the next line, and have justified the entire line? Because when I put <br> then justify crashes.

Here's jsfiddle http://jsfiddle.net/P3xYv/

Upvotes: 4

Views: 3458

Answers (1)

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201548

If you use a NO-BREAK SPACE U+00A0 between two words, instead of normal whitespace (like space or line break), browsers will keep those words together, on one line. Example:

"Hello my name is John Smith, and I&nbsp;am
a freshman!"

Here I have used the named character reference &nbsp;, but you can also use the NO-BREAK SPACE itself if you know how to type it in your authoring environment and have properly declared the character encoding. In most editing programs, NO-BREAK SPACE looks just like a normal space.

This is independent of text justification. In the old days, browsers used to treat NO-BREAK SPACE as non-stretchable in justification. But nowadays it is treated like space in justification, i.e. it gets its share of added spacing.

If you’d like to have a non-breaking non-stretchable space between words, you’d need a more complicated approach. You would use U+2005 FOUR-PER-EM SPACE or some other fixed-width space and you wrap the words in an element where line breaking is forbidden with HTML or CSS. For example, instead of I&nbsp;am you would write <nobr>I&#x2005;am</nobr> or, more clumsily but conforming to “standards”, <span style="white-space: nowrap">I&#x2005;am</span>. There is no guarantee that this will work in the future, though; there is no requirement in specifications that browsers support fixed-width characters this way (but this is a simple and natural implementation, and the current one).

Upvotes: 4

Related Questions