hyhnnator.js: Wie Wörter nur, die Container überlaufen?

Question

Ich frage mich, ob es ist, mit , nur Wörter, die größer als der Container sind, aber alle anderen Wörter wie sie sind. Alle anderen Worten sollte nur in die nächste Zeile brechen (wenn sie den Behälter passen.)

Hyphenator.config({ 
 
    defaultlanguage: 'en' 
 
}); 
 
Hyphenator.run();

body { 
 
    font-family: sans-serif; 
 
    font-size: 25px; 
 
    color: #333; 
 
    margin: 50px; 
 
    display: flex; 
 
    width: 800px; 
 
} 
 

 
div { 
 
    padding: 20px; 
 
    margin: 20px; 
 
    width: 270px; 
 
    background-color: #f0f0f0; 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/Hyphenator/5.3.0/Hyphenator.min.js"></script> 
 
<div class="hyphenate"> 
 
    <p><strong>with hyphenator</strong>:</p> 
 
    <p>How can I force hyphens on words that are very long, like this one: "Verylongwordthatshouldbehypenated"?</p> 
 
    <p>But, as long as words will fit the container I don't want Hypenation. So there should be no hyphens here: "Iamalongword Cellardoor Anotherlongword Thisisaprettylongword"</p> 
 
</div> 
 

 
<div> 
 
    <p><strong>What I would like</strong>:</p> 
 
    <p>How can I force hyphens on words that are very long, like this one: "Verylongwordthat&shy;shouldbehypenated"?</p> 
 
    <p>But, as long as words will fit the container I don't want Hypenation. So there should be no hyphens here: "Iamalongword Cellardoor Anotherlongword Thisisaprettylongword"</p> 
 
</div>

Hyphenator Verwenden ich alle Worte wie diese brechen kann: Hyphenator.run();

Das Problem ist, dass es Wörter trennt, die nicht getrennt werden sollen. Hier

ist ein Stift, das Problem zu veranschaulichen: https://codepen.io/pwkip/pen/NwxKrr

irgendeine Weise um diesen?

Answer 1

Von einem kurzen Blick auf the documentation und mit Ihrem codepen Hantieren Sie können das erreichen, indem entweder die leftmin oder minwordlength Konfigurationsoption erhöht oder useCSS3hyphenation ermöglicht.