0

IE9でmax-widthプロパティを使用しようとしています。動的に生成された幅のテーブルセルで使用されています（私はdataTablesを使用しています）。また、「text-overflow：ellipsis;」を使用しています。基本的に文字を視覚的に切り取る効果がありますが、max-widthなしではできません。

動的に作成されたものは他のすべての場合に問題なく機能するため、各テーブルセルに設定された幅を定義したくありません。

これが私のCSSです：

.tableViewer tbody tr td {
max-width:220px;
overflow:hidden;
text-overflow: ellipsis;
 color: #000000;
font-size: 12px;
margin: 0 0 0 20px;
padding: 5px 5px 5px 10px;
border-left: 1px solid #fff;
border-right: 1px solid #ccc;
/*border-bottom:  1px solid #D8D8D8; */
 -webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
}

前述のように、HTMLはDataTablesを介して生成されます。しかし、これがレンダリングされた形式です。

<tr class="odd">
<td class=" sorting_1" title="aaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbb@aaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbb.com" style="max-width: 220px; overflow: hidden; ">aaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbb@aaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbb.com</td>
<td class="" title="aaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbb" style="max-width: 220px; overflow: hidden; ">aaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbb</td><td class="" title="aaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbb" style="max-width: 220px; overflow: hidden; ">aaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbbaaaaabbbbb</td>
<td class="" title="" style="max-width: 220px; overflow: hidden; "></td><td class="" title="" style="max-width: 220px; overflow: hidden; "></td>
<td class="" title="" style="max-width: 220px; overflow: hidden; "></td><td class="" style="max-width: 220px; overflow: hidden; ">2 <a href="#">view</a></td></tr>

長いタイトルで申し訳ありませんが、それが私がこれを理解しようとしている理由です。誰か提案がありますか？

編集：

リクエストに応じて、CSS/HTMLと問題を示すJSfiddleがあります。http://jsfiddle.net/PY4cb/

4

1 に答える 1

1

さて、私は答えを理解しました（@MrOBrianからのいくつかのポインタのおかげで）-含まれているテーブルはこの属性を持っている必要があります：

table-layout: fixed;

IEのみ。IEは、何らかの理由で、この要素を持たないテーブルのセルのmax-widthを受け入れません（他のすべてのブラウザーは受け入れます）。

于 2012-10-11T11:40:56.713 に答える