Размер шрифта медиа-запроса не изменяется

Question

У меня возникли проблемы с размером шрифта h1, не меняющимся с помощью медиа-запроса. Я тестировал изменение других стилей, и он работает. Итак, я озадачен тем, почему размер шрифта не изменится.

HTML: 
<h1 class="header-h1">POVERTY IS NOT DESTINY</h1> 

CSS: 
    @media only screen and (max-width: 800px) { 
    h1.header-h1{ 
     font-size:250% !important; 
     color: blue !important; 
     font-weight:bold !important; 
    } 
} 

шрифт будет синеть и быть смелым, но размер шрифта не изменится .... Помощь?

Answer 1

Для размера шрифта: ##% для работы вам необходимо установить размер родительского шрифта. Поскольку% находится в процентах от родительского размера шрифта. Если вы установите

h1{font-size:16px} 

Затем установите

h1{font-size:50%} 

Это не будет работать, потому что ваш перекрывая оригинальный размер шрифта.

Однако установка размера шрифта патента, например, тела. Затем он будет работать.

body{font-size:16px;} 

http://jsfiddle.net/0np59ueh/