"pre"는 최소 너비의 문자로 채워지고 크기 조정시 자동 줄 바꿈

Question

일부 문자 열 (모두 알파벳 및 희귀 개조 문자, 공백 또는 다른 구분 기호가 없음)이 표에 채워집니다. 셀, 최대 셀 너비 (창 크기에 따라 다르지만 예제에서는 50%)로 설정됩니다. 테이블 셀 너비가 맞았을 때 브라우저가 문자열을 거의 감싸지 않게하고 문자열의 줄 바꿈 문자도 환영합니다. 표 셀의 내용은 주어진 고정 최소 너비 (예 : 200px 아래에 있음)가 있어야합니다. 그러면 창 크기를 더 크게 조정하면 세로 스크롤이 표시됩니다. 내가 td (playground)에 대한 max-width를 사용하여 FF10에 필요한 동작을 달성

,하지만 난에 대해 동일한 작업을 수행 할 수 없습니다 창이 그냥이 화면에 표시 너무 작아 한이 순간 IE : max-width을 무시합니다. max-width이 으로 설정되면 그 이상이 매우 이상합니다. 렌더러는 내용의 실제 너비를 무시하고 pre이 래핑되지 않았다고 생각합니다. (playground - FF와 비슷한 문제가 발생했으며 유사한 문제가보고되었습니다. here 및 there). 최악의 경우 내용을 정확히 200px (IE의 경우 pre에 적용해야하고 td의 경우 적용되지 않음)으로 고정 시켜도됩니다. 이 수정 프로그램이 IE에만 ​​영향을 미치기 위해 다음 CSS를 시도했습니다.

pre { 
    white-space: pre-wrap; 
    word-wrap: break-word; 
    width: expression("200px"); 
} 

td.wrap { 
    color: red; 
    max-width: 200px; 
} 

불행히도 IE8에서는 작동하지 않습니다.

대상 브라우저 : FF9 (이상), IE7, IE8, Chrome (최신). IE를 찾지 명확한 해결책 : 나는 How do I wrap text in a pre tag?, How can I word wrap this list item?, Not able to do max width, Max-Width not working on Table for IE7 및 많은 다른 사람을 확인했다 :이 문제가 중복 인 경우

죄송합니다.

Answer 1

나는 다른 측면에서 문제에 접근하려 시도했다. div에서 min-width: 400px으로 테이블을 감싸고 IE bahave를 만든다. 여기는 바이올린이 있습니다 : http://jsfiddle.net/6Agbw/3/. 희망이 당신이 필요합니다.