Не уверен, что я правильно понял ваш вопрос, но перечисленные там классы CSS не соответствуют вашим HTML классам. Установка ширины для классов .col1 должна гарантировать, что первый столбец всех таблиц должен быть одинаковым. Если вы хотите, чтобы он реагировал на размер экрана, установите процент.
Более простой способ сделать это, не устанавливая класс для каждого td отдельно, (при условии, что у вас одинаковое число s на каждом) использовать td:nth-child(1) и установить для него ширину. Это выбирает первый дочерний элемент каждого и устанавливает ширину для этого.
Если в первом столбце есть какие-либо заголовки таблицы, вам нужно установить ширину для тех, кто отдельно, используя тот же метод, но с помощью th:nth-child(1).
Еще один метод, который может быть полезен, если вы хотите чтобы указать ширину без использования n-го дочернего элемента, для нескольких столбцов в таблице это <colgroup>:
<colgroup>
<col class="1">
<col class="2">
<col class="3">
</colgroup>
Браузер интерпретирует первый дочерний элемент <colgroup> как первый столбец, второй - как второй колонка и пр. Теперь вы можете установить каждую ширину для каждого столбца (для таблиц, которые имеют много столбцов, это было бы полезно и более интуитивно понятно, чем nth-child). Однако не так много CSS свойств, которые могут применяться к <col> - я думаю, что на данный момент их всего 4 (border, background, width and visibility), поэтому вы не можете применять такие вещи, как text-align.