4

I would like this string to break at * if necessary (there is no more place to write).

7 380 Ft,*159 Ft termékdíjjal

like

 7 380 000 Ft, 
 159 125 Ft termékdíjjal

How to achieve this in html?

  produces "wrong" breaking, like:

 7 380 000 Ft, 159 125 
 Ft termékdíjjal

3 Answers3

8

There are two ways to specify a conditional (allowed) line break: the <wbr> tag, which is being standardized in HTML5, and the zero width space character (U+200B, &#x200b;). Both work well in modern browsers, but if you wish to cover old browsers, there are many tricky issues.

On the other hand, any space is normally treated as allowing a line break. So what might really need is just the use no-break spaces instead of spaces in situations where a line break must not appear.

Example:

7&nbsp;380&nbsp;000&nbsp;Ft, 159&nbsp;125&nbsp;Ft termékdíjjal

The source is more readable if you use the no-break space U+00A0 itself instead of the &nbsp; reference. The method of typing it varies by program.

Jukka K. Korpela
  • 195,524
  • 37
  • 270
  • 390
5

&nbsp; is a non-breaking space. <br /> is a forced break. OP is looking for a suggested break location. The line breaks are chosen by the renderer and they're usually on a space or a hyphen. Try <wbr /> if the browsers you are designing for support that tag. See http://www.cs.tut.fi/~jkorpela/html/nobr.html#wbr

Alternatively, use the solution posted here: Specifying a preferred line break point in HTML text in a responsive design

<span style="display: inline-block;">7 380 Ft, </span>
<span style="display: inline-block;">159 125 Ft termékdíjjal</span>

Output:

7 380 Ft, 159 125 Ft termékdíjjal

IceArdor
  • 1,961
  • 19
  • 20
  • Thanks, this is just what I was looking for. It seems about the only solution when you have a currency value like "EUR 1,000,000.00 (USD 1,211,123.00)" as obviously one wants to wrap between the currency and the currency conversion, but if you use hard breaks, if additional wrapping is needed it will happen at the commas, which is definitely where you don't want it to happen. – user6856 Jun 22 '21 at 12:58
-5

You could use <br> http://www.w3schools.com/tags/tag_br.asp

<br> is effectively the html equal of hitting the enter key in a word processor.

but in some cases it will insert a new paragraph. So I think <br/> is your best option.

  • You do not have to give negative reputation if you share a different opinion. He said that "   produces "wrong" breaking " . – user2523415 Dec 03 '13 at 13:57
  • He did not said specifically what he wanted, only what he wans to achieve. A finnish tutorial is not a benchmark in html learning. The { } tag is new in HTML5 and does not work in all the situations. – user2523415 Dec 03 '13 at 14:06