Как исправить всплывающую подсказку HTML без стилей?

При работе с всплывающей подсказкой html и применении стилей к классу всплывающей подсказки стили применяются с проверкой инструментами разработчика, но не отображаются на странице.

Я пробовал запускать свой код в w3schools, и он работает. Пытался изменить значения в DevTools, и в моем локальном он все тот же.

<h4>
I am 
<input type=number>
years old 
<span class= "tooltip">Some Text</span>, my annual income old <br> 
is 
<input type=number> 
and I have saved <br> 
<input type=number class= "numbers"> 
<span class="sub">(pre-tax or tax-exempt)</span>
and 
<input type=number> <span>(taxed).</span>
</h4>

И применяемые стили:

.tooltip {
    position: relative !important;
    border: 2px solid black !important;
    height: 100px;
    background: red !important;
    width: 100px;
}

И вот что я получаю. Цвет фона, а также граница не видны, но они есть в исходнике.