CSS, 모든 div 너비를 텍스트로 채우기

글자 사이의 간격을 자동으로 변경하는 방법. 텍스트가 div의 전체 너비를 차지하도록하고 싶습니다. 텍스트는 정적이지 않습니다.CSS, 모든 div 너비를 텍스트로 채우기

<style type="text/css"> 
    #menu{ 
     width: 200px; 
     background-color: #000; 
     color: #336699; 
     font-size: 16px; 
     letter-spacing: 100%; 
    } 
    </style> 
<body> 
<div id="menu"> 
    tekstas 
</div>

출처

2010-12-02 lolalola

JamWaffles에 대한 무례한 의도는 없지만 심각하게도 (초기에) 올바르지 않거나 해결책에 가까워지지 않은 답변은 어떻게 받아 들여지고 5 개의 upvotes가 발생합니까? ... –

편집을 (... 항상 123 일, 텍스트를 수 변경 "또는"텍스트 텍스트 "). 불행하게도 이것은 단지 단어 간격하지 편지 간격을 변경하는 것은 할 방법이 없다 CSS에서 커닝 아마도 CSS3, 그러나

이 쉽게 text-align: justify CSS 속성으로 수행됩니다 :..

는

#menu 
{ 
     width: 200px; 
     background-color: #000; 
     color: #336699; 
     font-size: 16px; 
     text-align: justify; 
}

출처

2010-12-02 11:00:19 Bojangles

justify는 문자 간격이 아닌 단어 간격을 처리합니다. – ArK

Ooops! 거기에서 나의 사과. 내 회신> 때리고 조금 성급한 < – Bojangles

또한, 그것은 단지 다른 행이 뒤 따르는 행에 영향을 미칩니다. –

N있다 이런 방식으로 CSS를하는 방법. letter-spacing 특성은 백분율 값을 사용하지 않습니다. text-align: justify은 글꼴 커닝이 아닌 단어 사이의 공백에만 영향을 주며 다른 행이 오는 텍스트 행에만 적용되기 때문에 작동하지 않습니다.

특정 div의 문자 수를 계산하여 JS를 시도한 다음 너비를 채울 수 있도록 문자 사이에 필요한 공간을 계산할 수 있지만이 솔루션은 모노 간격으로 만 작동합니다 글꼴 (모든 문자에 대해 동일한 너비의 글꼴).

출처

2010-12-02 11:00:52

'letter-spacing'은 픽셀 값에서 작동합니까? (즉, 고정 된 경우 div의 너비입니까?) – Bojangles

예, 'letter-spacing'은 픽셀 값과 함께 작동하지만 단순히 문자 사이에 선언 된 값을 추가하거나 음수 값이 주어지면 빼면됩니다. –

-2

해결책은 모두에게 적용되지는 않지만 저에게 문제를 해결하는 것으로 밝혀졌습니다 : 짧은 제목의 텍스트를 표시하는 경우 모든 단어 "L ikethis"의 모든 문자 사이에 공백을 넣을 수 있습니다. .

제 디자인의 경우이 모양이 괜찮아 보입니다. 물론 align: justify은 div 내에서 완벽하게 작동합니다.

출처

2015-02-26 14:16:09

CSS, 모든 div 너비를 텍스트로 채우기

답변

관련 문제