У меня есть следующая таблица в моем HTML:

<div style="max-width:700px;">
    <table border="1">
        <tr><td colSpan="2">this is a loooooooooooooooong text</td></tr>
        <tr><td width="1px">a:</td><td >b</td></tr>
        <tr><td width="1px">c:</td><td >d</td></tr>
    </table>
<div>

Я хочу, чтобы ширина первого столбца во втором и третьем ряду соответствовала длине содержимого (вот почему я ставлюwidth="1px" там). А пока я хочу, чтобы ширина таблицы соответствовала длине самого длинного содержимого в таблице (которая является первой строкой), а не охватывала максимальную ширину его ограничивающего элемента div.

Это работает в Firefox, как показано ниже.

Однако в IE 9 он работает не так, как ожидалось, как показано.

Я пытался заменитьwidth="1px" с участиемwidth="1%", Но тогда ширина таблицы будет равна максимальной ширине родительского div.

Кто-нибудь знает как это исправить в IE?