Блог

У меня есть 2 таблицы на разных страницах. Обе таблицы имеют одинаковые первые 2 столбца. Первый столбец представляет собой изображение в виде таблицы, а второй столбец — флажок.

Оба можно увидеть здесь: http://jsfiddle.net/VH4Q8/1 /

У меня возникают трудности с получением одинаковой ширины первых 2 столбцов в обеих таблицах, хотя в каждой таблице первому столбцу присваивается класс tearsheet-image , а второму столбцу присваивается класс fund-compare-column , ширина которого указана следующим образом:

 .tearsheet-image {
    width: 13px;
}

.fund-compare-column {
    width: 13px;
}
  

Что мне нужно сделать, чтобы обе таблицы имели одинаковую ширину столбцов для первых 2 столбцов?

В вашем CSS у вас есть table {width:100%}

Это противоречит вашему требованию 13px / 13px / 250px. Так что, я думаю, что-то должно дать.

Я считаю, что самый простой способ контролировать ширину столбцов таблицы — это использовать <col> элемент:

 <table>
  <col class="tearsheet-image">
  <col class="fund-compare-column">
  <thead>
    ...
  

… тогда вам не нужно указывать класс столбца в каждой ячейке каждой строки. Однако, если я правильно помню, будут применены не все свойства стиля, но ширина и фон есть, а выравнивание текста — нет :(.