Faced with an incomprehensible problem in css. Chrome carries the words in a hyphen. Those. the phrase: "The project of the house I-455-555", if it does not fit wider, does not carry the whole word, but can take it and cut it out by a hyphen: "The project of the house I-455- (transfer) 555 enter image description here

No white-space , such as pre-wrap , pre-line work.

Has anyone encountered this problem?

    4 answers 4

    As an option to use the indivisible hyphen

    http://jsfiddle.net/nghtpxwc/

     <p>Проект дома я&#8209;455&#8209;555</p> 
     p { white-space: pre-wrap; width: 150px; min-height: 100px; border: 1px solid #000000; padding: 10px; }

    or so http://jsfiddle.net/jmwqngjc/

    • one
      As I wrote pre-wrap does not work. Anyway, it transfers exactly by a hyphen. An indivisible hyphen just won't be able to insert, because the name of the project is driven through the admin panel into the usual text field. Making the contentmaker girl insert such "crocodiles" instead of hyphens is not an option. Remains JS-script? But it will be cruel. Positions almost under 1000. On the client, the machine will hang mercilessly. It is strange that such a thing is created in Chrome. In Fox, everything is fine - the transfer of the word entirely. - Romancho
    • and the second option jsfiddle.net/jmwqngjc ? - soledar10
    • Is it really such a big problem - to force the performer instead of a hyphen to paste from the clipboard & # 8209; ? .. I would have driven such "content girls" ... - deivan_

    If this is a special case, then you can look in the direction of the nobr tag

      Use hyphen conversion when saving to database.

      The code for php (there is a non-breaking hyphen between the second quotes):

       $content = str_replace('-', '‑', $content);

        You can remove the transfer altogether. To do this, use the following styles:

         p{ white-space: nowrap; }