4

私のウェブサイト全体に、<table>(テキストを折り返さずに)可能な限り最小限のスペースに絞りたい特定の列がある多くのsがあります。他の兄弟セルは、残りのスペースを自動的に共有します。

私は次のトリックを使用していますが、IE7-を除くすべてのブラウザーで機能します。(現時点では、実際にはIE7のみを気にしています)

table {width:100%;}
table td.min-col {white-space:nowrap; width:1px; }

jsFiddleリンク:http ://jsfiddle.net/vm8gc/23/

IE7でこれを試してみると、動作が異なることに気付くでしょう(予期しない動作)。-以下のスクリーンキャプチャを参照してください。

誰かがこれを達成するためのIE7の修正を考えることができますか?


添付ファイル:

他のすべてのブラウザ:

ここに画像の説明を入力してください

IE7:

ここに画像の説明を入力してください

4

1 に答える 1

4

CSS2 バージョン

何らかの理由で、Internet Explorer はwhite-spaceTD を無視しているようです。この問題を回避する最善の方法は、TD 内でスパンを使用することです。

<td><span style="white-space: nowrap;">This should not wrap</span></td>

いつものようにIEは自分のことをやっています;)

サポートについてwhite-spaceは、こちらを参照してください。

http://www.quirksmode.org/css/whitespace.html

前のバージョン

古いブラウザーでより適切にサポートされる代替手段は、次のようにすることです。

<td><pre>This will not wrap</pre></td>

次に、通常のテキストと同じ方法でスタイルを設定するか、親からスタイルを継承できるように pre 要素を設定します(継承は、スタイルを指定するだけのサポートが少ない可能性があります)

td pre { font-family: inherit; font-size: inherit; color: inherit; ... }
于 2012-08-31T09:04:47.460 に答える