"pre"には最小幅の文字が入力され、サイズ変更時は自動折り返し

Question

文字列があります（アルファベットと珍しい改行のみです。空白またはその他の区切り文字はです）。セルの最大セル幅（ウィンドウサイズによって異なります）は、この例では50%に設定されています。私はテーブルのセル幅がヒットしたときにブラウザが文字列をほとんどラップしないようにするだけでなく、文字列の改行文字を歓迎します。表のセルの内容は、一定の最小幅（例では200px）でなければなりません。これにより、ウィンドウのサイズがさらに大きくなると垂直スクロールが表示されます。

私はtdためmax-width（playground）を使用してFF10で必要な動作を実現しているが、私は同じことを行うことはできません。窓はちょうど私がこのスクリーンショットに表示が小さすぎるようになったこの瞬間IE：それはmax-widthを無視します。 max-widthがpreに設定されていると、それ以上の動作は非常に奇妙です。レンダラーは内容の実際の幅を無視して、preがラップされていないと考えています（playground - FFと似ています。最悪の場合、コンテンツを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

私は別の面から問題にアプローチしようとしました:) min-width: 400pxでdivにテーブルをラップすると、IE bahaveになります。ここにはフィドルがあります：http://jsfiddle.net/6Agbw/3/。これがあなたが必要としていることを願っています。