& shy;如何在单词结尾处消除多余的连字符 [英] ­ How to get rid of the extra hyphen at the end of word

问题描述

我有一句话，我在其中加上了& shy; .直到我的屏幕尺寸足够小之前，它都可以连字符，然后在末尾添加一个额外的连字符.

I have a word that I have put a ­ inside. It hyphens alright until I get to a small enough screen size then it adds an extra hyphen at the end.

不能在jsfiddle中重现它，因为它似乎以不同的方式解释html.我可以显示问题的图片

Can't reproduce it in jsfiddle, because it seems to interpret the html differently. I can show a picture of the problem however

<h3>
Flu&shy;ffyluffy Some&shy;something</h3>

成为

最后加一个连字符

我看到了这个，并不很喜欢答案，

I saw this and didn't really like the answer, Extra hyphen at end of word if ­ is used in middle of the word and the parent div is narrow. "just make the div wider".

有什么方法可以使其不添加我没有要求的多余连字符吗?

Are there any ways to make it not add extra hyphens I didn't ask for instead?

写作

<h3 class="something">Something Something&shy;Something</h3>



<style>
.something{
 width:85px
}
<\style>

在 http://htmledit.squarefree.com/

引起类似的问题，但不完全相同.我似乎只能用Chrome复制

Causes a similar issue but not quite. I can only seem to replicate with Chrome

推荐答案

可以使用flex吗?

Codepen

HTML

如果我添加 display:inline-flex;

<h3 class="something">
  Flu&shy;ffyluffy Some&shy;something
</h3>

CSS

.something{
 width:60px;
 display: inline-flex;
}

这篇关于& shy;如何在单词结尾处消除多余的连字符的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！