2011-03-15 5 views
0

나는 다음과 같은 한 HTML/CSS :오페라 <table> 랩 버그

<html> 
<body> 
<style type='text/css'> 
.result_table table { 
    border-collapse:collapse; 
} 
.result_table table td { 
    white-space:nowrap; 
    max-width:200px; 
    overflow:hidden; 
    padding:4px; 
    max-height:24px; 
    height:24px; 
} 
</style> 
<div class="result_table"> 
<table border=1><thead><tr><td>Title</td></tr></thead> 
    <tbody> 
    <tr> 
    <td>Lorem ipsum dolor sit amet, ...</td> 
    </tr> 
    </tbody> 
</table> 
</div> 
</body> 
</html> 

때 "LOREM impsum"큰 길이 (이상 9000 개 문자)가, Opera 브라우저는 더 휴식 기호가없는 경우에도, 텍스트 줄 바꿈 시작 TD에는 nowrap 및 overflow 지시문이 있습니다.

enter image description here

다른 유명한 브라우저 모두 잘 수행

enter image description here

+2

어떤 Opera 버전인지 잊어 버렸습니다. – SpliFF

+1

http://jsfiddle.net/Kyle_Sevenoaks/ATEDV/ Opera 11.01에서 잘 보입니다. – Kyle

+0

WinXP의 Opera 10.51에서 작동합니다. 그의 질문에 – stealthyninja

답변

2

가능한 overflow-y:hidden는 오페라 display:table-cell 작동하지 않습니다. 가능한 해결 방법은 .result_table table tddisplay:block을 추가하는 것입니다.

데모 :http://jsfiddle.net/qXjV8/

또 다른 해결책은 사업부로 td 내의 텍스트를 감싸고 .result_table table td div

데모로 선택 변경 될 수있다 : 두 경우 모두http://jsfiddle.net/qXjV8/1/

를 I 다음과 같이 재설정 CSS를 사용하라는 조언 : http://meyerweb.com/eric/tools/css/reset/

두 경우 모두 Opera의 두 번째 줄이 부분적으로 표시됩니다. 이 문제를 해결하려면 line-height 속성을 사용할 수 있습니다.

+0

display : block - 멋진 아이디어를 게시했습니다. 감사! – heximal

+0

@heximal 당신은 환영합니다 :) – Sotiris

+0

btw, "netsted div"솔루션을 직접 찾았지만 많은 양의 genereated 데이터 때문에 그것을 사용하고 싶지 않습니다. 그것은 콘텐츠 길이를 늘릴 것입니다 – heximal