ширина Установка колонки с многоточием

Question

У меня есть таблица, как это показано ниже:

<tr> 
        <th scope="col"> 
         Nome Completo 
        </th> 
        <th scope="col"> 
         E-Mail 
        </th> 
        <th scope="col"> 
         Matrícula 
        </th> 
        <th scope="col"> 
         Filial 
        </th> 
    </tr> 

    <tr> 
        <td class="column50 ellipsis"> 
         ANGUS MACGYVER 
        </td> 
        <td class="column150 ellipsis"> 
         francisco.voccio@envvio.com 
        </td> 
        <td class="column100 ellipsis"> 
        1616161 
        </td> 
        <td class="column100 ellipsis"> 
         SÃO PAULO 
        </td> 
    </tr> 

Я хочу это иметь различную ширину, в зависимости от колонки. Вот мой упрощена CSS:

.general_webgrid table 
{ 
    table-layout: fixed; 
    border-spacing: 1px; 
    padding-bottom: 3px; 
} 
    .general_webgrid table td.column50 
     { 
      width: 50px; 
      max-width: 50px; 
     } 
    .general_webgrid table td.column150 
     { 
      width: 150px; 
      max-width: 150px; 
     } 
     .general_webgrid table td.column100 
    { 
     width: 100px; 
     max-width: 100px; 
    } 

    .ellipsis 
    { 
     overflow: hidden; 
     text-overflow: ellipsis; 
     white-space: nowrap; 
     } 

Я хочу, чтобы иметь определенную ширину, и если содержание шире, свойство многоточия вступает в силу на нем. Он хорошо работал в Chrome. Но в IE ширина, которую я определил, игнорируется, и ячейка принимает ширину содержимого внутри него.

Я использую WebGrid ASP MVC 3. Что я могу сделать, чтобы он работал в IE?

Answer 1

Попробуйте добавить width: 100% в ваш стиль .ellipsis ... за это сообщение на блоге quirksmode.org (http://www.quirksmode.org/css/textoverflow.html), это может помочь с вашей проблемой.