2014-02-10 5 views
0

div 속성에 word-wrap 값과 break-word이라는 CSS 속성을 사용하려고합니다.크기 조정 가능한 div의 CSS 단어 줄 바꾸기

완벽하게 작동하지만 너비를 지정해야만 (이 값이 자동이면 단어 겹침이 작동하지 않음).

문제는 div의 크기를 조정할 수 있기 때문에 처음에 div의 특정 너비를 입력 할 수 없다는 것입니다.

이 문제를 해결할만한 아이디어가 있습니까? 하이픈을 사용하고 싶지 않습니다.

미리 감사드립니다.

이 작동하지 않습니다 width:inherit 또는 width:100%

+1

관련 HTML 코드를 게시 할 수 있습니까? – anurupr

+0

코드를 피들이나 다른 것에 넣을 수 있습니까? –

+0

단어 줄 바꾸기 단어가 올바르게 부러져 있어야합니다. ?? –

답변

0

시도 :

<p style="word-wrap: break-word !important;">loooooooooong_word</p> 

이 확인을 작동 der div의 텍스트는 해당 div에 white-space CSS 속성을 지정해야합니다.

사전 포장 또는 정상으로 설정하십시오.

예 : Text Wrap

텍스트가 신문 열과 같이 나타나게하려면 text-align:justify 속성을 지정할 수도 있습니다.

예 : Justify

+0

고마워요.하지만 둘 다 똑같은 결과로 시도해 봤습니다. ( – forvas

0

에서 또는를 설정하는

<p style="width:100px; word-wrap: break-word !important;">loooooooooong_word</p> 

Fiddle

+0

당신의 도움을 위해 Thak으로 보내고, 보통, 이니셜, pre-wrap 및 pre-line으로 공백을 시도했지만 아무 일도 없었습니다. – forvas

+0

왜 안 그러니? 너비를 백분율로 지정하거나 너비가 아닌 최대 너비와 최소 너비 일 수 있습니다. 그러면 div의 크기를 조정할 수 있고 div가 너무 작아지면 단어가 깨집니다. –

0
<p>loooooooooooong_word</p> 


<p style="word-wrap: break-word !important;">loooooooooong_word</p> 

<p style="width: 100px; word-wrap: break-word !important;">loooooooooong_word</p> 

Fiddle

는 워드 랩이 잘 작동 브라우저의 크기를 조정 시도 ... !! 당신은 <p> 사이의 차이점을 찾을 수 있습니다 sytle 및 고정 픽셀

더 명확하게하려면 컴퓨터가 벙어리이며 단어를 어기려면 단어가 손상되어야하는 조건을 지정해야합니다 . 당신이 출력을 기대하는 조건을주지 않고?

+0

예, Fiddle에서 잘 작동하지만 내 애플리케이션에는 없습니다. 실제로 브라우저의 크기를 조정하면 looooooooooong_word가 사라집니다! – forvas

+0

코드에 넣은 부분을 표시하여 실수로 다른 CSS에 표시 될 수 있습니다. –

+0

맞습니다. 이제 코드 작성을 시도하고 있습니다. CSS 클래스의 나머지 부분은 작동합니다 ...문제는 다른 사람이 만든 템플릿을 사용하고 있다는 것입니다. 그러나 나는 왜 이해하지 못한다! 중요한 일은 아무것도하지 않고있다. – forvas