Теги h1, h2, h3 изменяются по размеру не так, как теги p

Question

Я пытаюсь изменить размер текста после изменения настроек размера шрифта на моем телефоне. Вот что я вижу, когда шрифт имеет минимальный размер:

И вот что я вижу, когда шрифт имеет максимальный размер:

Видите, как меняется соотношение сторон между тегами h3 и p? Тег p намного больше, чем тег h3. Как мне решить эту проблему?

Мой CSS код выглядит следующим образом:

h3{
   font: normal 26px Khand, Monda, Ubuntu, sans-serif;
  }

p{
  font:normal 18px Carrois Gothic, Ubuntu, sans-serif;
 }

Изменить: я добавил «text-size-adjust: 130%;» на мой h3, и он работает, но это не очень красивое решение ...

Answer 1

вы можете попробовать, добавив ! Important код по крайней мере: font:18px 'Carrois Gothic', 'Ubuntu', 'sans-serif' !important;, но это не решение.

Потому что разница в размере исходит от семейств шрифтов. Все шрифты не идентичны. Используйте инструменты разработки браузера, чтобы проверить свой тег. На панели стилей вы сможете проверить, действительно ли стили вашего тега атрибутированы или нет.