처음으로 기호를 사용하는 CSS 단어 찾기

Question

올바른 상황에서 주어진 잘못된 위치에서 긴 문자열을 끊는 경향이 있으므로 word-wrap: break-word; 규칙이 특정 상황에서보기에 너무 즐겁지 않습니다. 저를 미세 조정하는 내 CSS 규칙을 그 전에 먼저 문자를 통해 단어를 파괴하려고 있도록하기위한 방법이 있나요 대신

|--- DIV ---| 
|   | 
| English/ | 
| Spanish | 
|   | 
|-----------| 

의

|--- DIV ---| 
|   | 
| English/S | 
| panish | 
|   | 
|-----------| 

:

그것은 같은 것을 생산 실제 단어를 어기는거야? 그렇다면 어떻게해야합니까?

Answer 1

이러한 동작을 수행하는 유일한 방법은 단어 분리를 발생시키려는 위치의 마크 업에서 <wbr> (mdn link)을 사용하는 것입니다. 또한 잘 supported의

.word-box{ 
 
    width:100px; 
 
    margin:5em; 
 
    border:1px solid #606266; 
 
}

<div id='break-wbr' class='word-box'> 
 
English/<wbr>Spanish 
 
</div>

:

은 보라.

수줍음 하이픈 (­)

.word-box{ 
 
    width:100px; 
 
    margin:5em; 
 
    border:1px solid #606266; 
 
}

<div id='break-shy' class='word-box' lang='en'> 
 
English/&shy;Spanish 
 
</div>

하지만 수줍음 하이픈을 사용하는 단점이 점에서 볼 하이픈을 삽입한다는 것입니다을 사용하여 될 위치에 휴식하는 또 다른 방법 단어 나누기.

매우 비슷하고 자세한 대답 here을 살펴볼 수도 있습니다.

Answer 2

이것을 추가하십시오. word-break : keep-all;