크롬에서 회전 한 DIV 가장자리가 흐리게 처리됩니다.

정보가 회전하는 DIV에있는 오디오 게시물이 앨범 아트 위에 표시됩니다. 내가 무슨 뜻인지 알기 위해서 here (the page). 왼쪽 하단에있는 영역이 정보입니다. Chrome에서 볼 때 DIV의 가장자리가 흐리게 보입니다. DIV가 "선명하게 보이도록"별명을 지정하는 방법이 있습니까? 파이어 폭스가 완벽하게 보여주기 때문에 해결책이 아닌 것을 압니다.크롬에서 회전 한 DIV 가장자리가 흐리게 처리됩니다.

.audioBox { 
position:absolute; 
bottom:160px; 
margin-left:-11px; 
-webkit-transform: rotate(-90deg); 
-moz-transform: rotate(-90deg); 
z-index:3; 
width:343px; 
} 

.boxify { 
margin:1px; 
padding:5px; 
float:left; 
bottom:0; 
width:329px; 
} 

.box { 
background:#000; 
padding:5px; 
padding-left:10px; 
padding-right:10px; 
margin-left:-5px; 
} 

<div class="audioHolder"> 
<div class="audioBox"> 

<div class="boxify" id="song"> 

        <img id="audioBubble"  
src="http://static.tumblr.com/ux4v5bf/JC6lpv4v1/audio.png"> 

{block:TrackName} 
<span class="box">{TrackName}</span> 
{/block:TrackName} 
</div> 

<div class="boxify" id="artist"> 
{block:Artist} 
<span class="box">{Artist}</span> 
{/block:Artist} 
</div> 

<div class="boxify" id="label"> 
<span class="box">{PlayCountWithLabel}</span> 
</div> 

<div class="boxify" id="download"> 
<span class="box">Download 
{block:ExternalAudio} 
<a href="{ExternalAudioURL}">Download</a> 
{/block:ExternalAudio}</span> 
</div> 

</div>

해결책 : 대신 배경색을 배경색 대신 동일 색상으로 바 꾸었습니다. :-) 다른 누군가에게 유사한 문제가 있기를 바랍니다.

출처

2011-08-16 Earl Larson

앨리어싱은을 사용하는 데 도움 크기를 변경 비슷한 문제가

... 내가 좀 늦었 어 알고 있지만 CSS에서는 불가능합니다. 앤티 앨리어스는 브라우저에 의해 제어됩니다. –

이렇게 실제 해결책이 없습니까? –

컨트롤 앤티 앨리어싱에 대한 다른 스레드를 탐색 할 수 있지만 캔버스에 대한 것입니다. http://stackoverflow.com/questions/195262/can-i-turn-off-antialiasing-on-an-html-canvas-element –

나는 지금 내 경우에는, 단지 짝수

.blurry { 
    left: 100px; 
    height: 30px; 
    width: 135px; 
} 

.sharp { 
    left: 200px; 
    height: 30px; 
    width: 136px; 
}

http://jsfiddle.net/_hags/9e4cS/

출처

2014-04-03 11:40:03 hagi

조금 늦었습니까? 이 게시물은 2011 년에있었습니다! – Albzi

그래, 구글은 여전히 이상한이 게시물을 기억;) – hagi

크롬에서 회전 한 DIV 가장자리가 흐리게 처리됩니다.

답변

관련 문제