Почему не получается сделать РЕАЛЬНЫЙ размер шрифта меньше 16px при верстке сайта?

Question

[Aleksandr-Borisevich]

уже несколько раз при верстке сайта встречаюсь с тем, что при задании размеров шрифта, выставить шрифт меньше 16px не получается! Больше по размеру - пожалуйста! Но не меньше (16px). Т.е., задать то я могу, но в "Web Tools" будет стоять самым маленьким - 16px и не меньше.
Пользуюсь "VS code". Шрифты задаю "локально", через "@font-face". "Перебить", "переназначить" и т.д. размер шрифта - ни чем не получается! Даже через "!important".

Как наглядный пример три скрина: на первом и втором я задаю тексту "h4" размер 14px, а третьем скрине - итог (навел в браузере на выбранный текст - его размер 16px... и не меньше. Как с этим быть? Как уменьшить размер (сделать меньше 16px)? В чем здесь подвох?
Скриншоты фрагментов кода удалены модератором.

Comments

[Lynn «Кофеман»]

Сходить в настройки браузера и проверить что там не выставлен принудительный минимальный размер.

[Сергей delphinpro]

Код выкладывается текстом! Не картинками.
Вопрос НЕ пишется жирным!

[Ankhena]

Решать проблему в настройках вашего браузера.

Но вот это var(--font-family-bold) наводит на мысль о том, что шрифты вы всё таки подключаете неверно. Работать будут, но коллеги вас проклянут.
Шрифты разных жирностей подключаются с одним именем, а не с разными, как похоже сделано у вас.

Надо так:

@font-face {
        font-family: "OpenSans";
        src: url("fonts/opensans.woff2") format("woff2"),
        url("fonts/opensans.woff") format("woff");
        font-weight: normal;
        font-style: normal;
        font-display: swap;
        }

        @font-face {
        font-family: "OpenSans";
        src: url("fonts/opensansbold.woff2") format("woff2"),
        url("fonts/opensansbold.woff") format("woff");
        font-weight: 700;
        font-style: normal;
        font-display: swap;
        }

[Aleksandr-Borisevich]

Lynn «Кофеман», СПАСИБО!!!! Ты гений!!! Точно! В "НАСТРОЙКАХ" браузера, когда-то сам, выставил "минимальный шрифт - 16px", вместо того, чтобы ползунок передвинуть на "минимальный"!

[Aleksandr-Borisevich]

Ankhena, всё нашел решение!) Все оказалось элементарно!))) В "настройках" браузера в "языковых настройках" - сам лично, когда-то ползунок "МИНИМАЛЬНЫЙ ШРИФТ" - поставил на 16рх. Передвинул ползунок на "МИНИМАЛЬНЫЙ" - всё заработало!)
Спасибо за участие!)

[Aleksandr-Borisevich]

Сергей delphinpro, спасибо, учту!

[Ankhena]

Aleksandr-Borisevich,

А нужно ставить - минимальный!)))

Но имейте в виду, что у пользователя там может стоять что угодно.

И подключение всё таки поправьте, если я права.

[Aleksandr-Borisevich]

Да, абсолютно верно! Вот я и выставил, когда-то, сам себе "МИНИМАЛЬНЫЙ ШРИФТ - 16px". И верстая сайт, столкнулся с тем, что минимальным отражается шрифт "16px". Т.е., я задаю какому-нибудь тексту при верстке шрифт - 14px..., а он отражается равным - 16px.
Вот в чем "минус" выставления "минимума шрифта" - не уменьшается шрифт, меньше заданного нами же, минимального.

[Модератор]

Не надо лепить как можно больше тэгов.
См.п.3.1 Регламента. Также обратите внимание на п.3.4
Фрагменты кода надо размещать в виде текста и оборачивать тэгом code для корректного отображения. Удобно делать кнопкой </>
Это обязательно, см.п.3.8 Регламента.
Сюда же относится traceback, ввод и вывод в консоли и другая структурированная текстовая инфа.
Для верстки используйте codepen с кнопкой +.

[Ankhena]

Aleksandr-Borisevich,

Вот в чем "минус" выставления "минимума шрифта" - не уменьшается шрифт, меньше заданного нами же, минимального.

Если пользователь плохо видит, то у него в настройках будет стоять такой увеличенный шрифт (или другими настройками, не важно). И вы, верстая, должны это понимать и предусматривать правила так, чтобы при этом ничего не развалилось.

[Aleksandr-Borisevich]

Ankhena, Да, да!... стоит всё помнить!)) Или же как я, позабыть, а затем столкнуться с такой проблемой и несколько недель выспрашивать ответ на разных форумах, у специалистов...