css, html 긴 단어 표시

페이지 오른쪽에 상자가 있고 왼쪽에 긴 단어가 필요합니다. 내 문제는 상자 뒤에서 긴 단어가 뛰는 것입니다. 나는 "word-wrap : break-word;"라고 덧붙인다. -하지만 동일합니다.css, html 긴 단어 표시

제발 봐 샘플 : 그것을 깰 않고 가능한 곳 컨테이너가 긴 텍스트의 폭보다 폭이 더 큰이 순간부터 http://jsfiddle.net/2dpcA/

<style> 
.page{ 
    width: 380px; 
    height: 600px; 
    margin: 0 auto; 
    background-color: #146A01; 
    word-wrap: break-word; 
} 
.box{ 
    float: right; 
    width: 200px; 
    min-height: 200px; 
    background-color: #336699; 
} 
</style> 
</head> 
<body> 
    <div class="page"> 
     <div class="box">Some text</div> 
     Lorem ipsum<br/> 
     Lorem ipsum small text small tekst small<br/> 
     VerylongTextIsHEREVerylongTextIsHEREV    
    </div>  
</body>

출처

2012-02-28 lolalola

나는 당신이 잘못된 바이올린을 연결했다고 생각합니다 – Dampsquid

, 배치됩니다.

.page span { 
    display: block; 
    width: 180px; 
    word-wrap: break-word; 
}

데모 : http://jsfiddle.net/s6XjW/4/

출처

2012-02-28 21:30:07 Sotiris

... 그리고 당신은 downvoted 때문에 .. ?? : O – Sotiris

고마워,하지만 텍스트가 긴 단어가 많이있을 수 있으며,이 옵션은 나에게 좋지 않습니다. 텍스트가 상자 뒤에 있다면, 그는 모든 페이지 너비에 표시해야합니다 – lolalola

HTML의 구조에서 나는 다른 것을 생각할 수 없습니다. 위와 비슷한 또 다른 해결책은이 예처럼 특정 폭의 div가있는 왼쪽에 모든 텍스트를 포함하는 것입니다. http://jsfiddle.net/s6XjW/5/ – Sotiris

사용 바꿈과 함께 단어 휴식 ...

한 가지 가능한 해결책은 범위와 큰 텍스트를 포장하고 다음 CSS를 사용할 수

.page{ 
    width: 380px; 
    height: 600px; 
    margin: 0 auto; 
    background-color: #146A01; 
    word-wrap: break-word; /* Internet Explorer 5.5-7 */ 
    word-break: break-all; /* Internet Explorer 8-9 */ 
}

fiddle을보세요.

출처

2012-02-28 21:32:33

바이올린은 해결책을 제공합니다 – Sotiris

고마워요.하지만 코드가 큰 공백을 만듭니다. – lolalola

나는 그것이 어떻게 보이지 않는지 .... ....? IE에서 보셨습니까? 지정된 폭의 긴 텍스트를 나눕니다. 그 OP가 요청한 것이 아닌가요? –

페이지에 표시되는 텍스트를 제어 할 수 있습니까?

그렇다면 긴 단어에 부드러운 하이픈을 삽입 해보십시오. 선택적 단어 분리가 발생할 수있는 위치를 나타냅니다.

aterriblylengthy&shy;longword

출처

2012-02-29 18:55:37 jim31415

css, html 긴 단어 표시

답변

관련 문제