Как я могу убедить IE соблюдать мои явные инструкции, чтобы сделать столбец таблицы шириной X пикселей?

0

Пожалуйста, рассмотрите этот небольшой, но полный фрагмент HTML:

<!DOCTYPE html >
<html>
<head>
    <title>Test</title>
    <style type="text/css">
    span {overflow:hidden; white-space:nowrap;  }
    td {overflow:hidden; text-overflow:ellipsis}
    </style>
</head>
<body>
    <table cellspacing="0"  >
        <tbody>
            <tr>
               <td nowrap="nowrap" style="max-width:30px; width:30px; white-space:nowrap; "><span>column 1</span></td>
               <td nowrap="nowrap" style="max-width:30px; width:30px; white-space:nowrap; "><span>column 2</span></td>
               <td nowrap="nowrap" style="max-width:30px; width:30px; white-space:nowrap; "><span>column 3</span></td> 
             </tr>
        </tbody>
    </table>
</body>
</html>

Если вы сделаете это в Chrome, вы увидите эффект, который я ищу.

Однако, сделав его в IE8 или 9, ширина и/или максимальная ширина игнорируются.

Итак, мой вопрос: как я могу заставить IE просто указывать ширину ячейки явно? (Было бы неплохо, если бы мне не пришлось использовать max-width, чтобы заставить Chrome вести себя).

Кстати, я пробовал различные комбинации table-layout: исправил и использовал colgroup с cols и все виды, ничто из того, что я пробовал, убеждает IE делать то, что я явно прошу, чтобы это явно делалось.

Теги:
html-table
internet-explorer
google-chrome

1 ответ

2
Лучший ответ

Попробуйте на свой стиль table:

table {table-layout: fixed; width :0px;}

Вы можете вырезать max-width:30px

Вы упомянули, что использовали table-layout, но указав, что width здесь делает трюк

Поделиться
  • 0
    ОП заявил, что он попробовал это.
  • 1
    Выглядит хорошо, пока я обнаружил, что могу изменить максимальную ширину и просто установить ширину таблицы равной 0px, и все браузеры генерируют одинаковый результат.
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню