CSS에서 텍스트 줄 바꿈하는 방법

-1

긴 텍스트가 있고 자동 줄 바꿈 시스템이 필요합니다. 이 일을 할 수있는 방법이 있습니까?CSS에서 텍스트 줄 바꿈하는 방법

여기 내 사업부입니다.

<div class="alert alert-warning" style="font-size: 100%; text-align: left;">some long text here!</div>

나는 몇 가지 해결책을 시도했지만 나에게 도움이되지 못했습니다.

enter image description here

word-wrap: break-word; overflow: visible;

는 편집 : 나는 위와 같이 동일한 출력을 얻고있다. 이 div의 너비를 변경하면 div의 너비는 변경되지만 텍스트는 동일하게 유지됩니다.

<div class="alert alert-warning" style="font-size: 100%; text-align: left; word-wrap: break-word !important; 
      overflow: visible !important;">fadsfsd dsf asdf asdf asdf asdf asdffafdsafads dsf sadf asdf sadf asdf sdsdfasdfadsfdasfsdds sadf sadf sadf asdf asfsdfsdfasdfadsfdasfdsa sdaf sadf sadfas d 
</div>

출처

2015-01-26 hellzone

http://codepen.io/anon/pen/YPQRKK는 - 그것은 크롬과 파이어 폭스에 모두 [도 오버 플로우를 변경, 기대 작품으로. 어떤 브라우저에서 시도하고 있습니까? – fcalderan

"fdsafdsa"라는 문자 사이에 공백이 없으므로 긴 "단어"안에 텍스트를 띄우면 기본 휴식이 단어에 적용됩니다. 하나의 긴 단어입니다 .... 단어를 끊으려면 또 다른 것 – DaniP

@ FabrizioCalderan 나는 그것이 지금 나를 위해 일하는 이유를 알지 못했다. 어떤 CSS가이 스타일을 무시할 수 있습니까? – hellzone

사용이 CSS 스타일이 작동합니다

.alert alert-warning{ 
width:98%;/*set the width by your needs*/ 
white-space: normal;}

출처

2015-01-26 13:59:06 rJ7

공백을 추가하면 성공했습니다. 답변에 감사드립니다. – hellzone

@hellzone 다음 다른 공백을 다른 곳에서 정의했습니다. – fcalderan

그는 자동 줄 바꿈 만하면됩니다. 그것을 위해 제대로 작동합니다. – rJ7

이 시도하십시오 width가 지정된 경우

word-wrap: break-word; 
overflow: visible; 
width: 800px;

바꿈 만 작동합니다.

출처

2015-01-26 13:45:56 Gerwin

제발, 당신은 정의 된 너비의 필요성에 대한 참조를 게시 할 수 있습니까? [MDN] (https://developer.mozilla.org/en-US/docs/Web/CSS/word-wrap)에서 나는 그것을 보지 못했습니다. – fcalderan

이전에 워드 랩 : 작동하지 않았던 경험이 있었지만 너비를 정의했을 때 아마도 나머지 코드 덕분이었을 것입니다. 흥미 롭습니다 만, MDN에 언급 된 t – Gerwin

CSS에서 텍스트 줄 바꿈하는 방법

답변

관련 문제