Почему разные размеры текста находятся в разных столбцах таблицы в мобильных браузерах Chrome и Chromium?

Question

Мобильные Chrome и аналогичные браузеры Chromium ведут себя очень странно. Они показывают первую группу столбцов с небольшим размером, а вторую группу с большим размером. Проблема есть на любых телефонах. Рабочий стол Chrome и другие браузеры показывают содержимое нормально. Я проверил мой код с помощью валидатора HTML и CSS. Результаты здесь:

https://validator.w3.org/nu/?doc=http%3A%2F%2Fdz4all.ru%2F

HTML и CSS здесь.

table {
    margin-bottom: 30px;
    background-color: white;
    border-collapse: collapse;
}

td, th {
    border-top: 1px solid grey;
    border-bottom: 1px solid gray;
    border-right: 10px solid rgb(240, 240, 245);
    border-left: 10px solid rgb(240, 240, 245);
    vertical-align: top;
}

.dayWeek {
    color: #1d1d1b;
    font-size: 24px;
    font-style: normal;
    font-stretch: normal;
    font-weight: 700;
    line-height: normal;
    font-family: NotoSerif-Bold,serif;
}

.date {
    font-family: Roboto,sans-serif;
    color: #1d1d1b;
    font-size: 14px;
    font-style: normal;
    font-stretch: normal;
    font-weight: 300;
    line-height: 1.6;
}

.subject {
    color: brown;
    font-size: 18px;
    font-style: normal;
    font-stretch: normal;
    font-weight: 400;
    line-height: normal;
    font-family: Roboto-bold,sans-serif;
}
.lesson_content {
    font-family: Roboto,sans-serif;
    color: #7d7e86;
    font-size: 14px;
    font-style: normal;
    font-stretch: normal;
    font-weight: 600;
    line-height: normal;
}

.homework {
    font-family: Roboto,sans-serif;
    color: #7d7e86;
    font-size: 14px;
    font-style: normal;
    font-stretch: normal;
    font-weight: 600;
    line-height: normal;
}

<table>
    <tbody>
        <tr>
            <th> <span class="dayWeek">Понедельник</span>
                <br>
                <span class="date">21.10</span>
            </th>
            <th> <span class="dayWeek">Вторник</span>
                <br>
                <span class="date">22.10</span>
            </th>
            <th> <span class="dayWeek">Среда</span>
                <br>
                <span class="date">23.10</span>
            </th>
            <th> <span class="dayWeek">Четверг</span>
                <br>
                <span class="date">24.10</span>
            </th>
            <th> <span class="dayWeek">Пятница</span>
                <br>
                <span class="date">25.10</span>
            </th>
        </tr>
        <tr>
            <td> <span class="subject">Иностранный язык (английский):</span>
                <br>
                <span class="lesson_content" style="display: inline;">Прямые и непрямые вопросы</span>
                <br class="br" style="display: inline;">
                <span class="homework">Дз: с 42 у3, 4, 5</span>
                <br>
            </td>
            <td> <span class="subject">Русский язык:</span>
                <br>
                <span class="lesson_content" style="display: inline;">Типы сложных предложений. Средства связи между частями предложения</span>
                <br class="br" style="display: inline;">
                <span class="homework">Дз: Подготовиться к тестированию</span>
                <br>
            </td>
            <td> <span class="subject">Литература:</span>
                <br>
                <span class="lesson_content" style="display: inline;">«Не образумлюсь, виноват…» Анализ 4 действия</span>
                <br class="br" style="display: inline;">
                <span class="homework">Дз: 3 действие</span>
                <br>
            </td>
            <td> <span class="subject">Литература:</span>
                <br>
                <span class="lesson_content" style="display: inline;">РР И.А.Гончаров «Мильон терзаний». Работа с критической литературой</span>
                <br class="br" style="display: inline;">
                <span class="homework">Дз: 4 действие</span>
                <br>
            </td>
            <td> <span class="subject">Алгебра:</span>
                <br>
                <span class="lesson_content" style="display: inline;">Область определения функции</span>
                <br class="br" style="display: inline;">
                <span class="homework">Дз: вариант огэ</span>
                <br>
            </td>
        </tr>
</table>

Answer 1

Я нашел решение проблемы. Я просто добавил в тег <head> одну строку:

<meta name="viewport" content="width=device-width, initial-scale=1.0"> Но я должен сказать, что разметка HTML может быть разной на настольном компьютере и на телефоне.